in my use case i have integrated the conversion of asciidoc files (.adoc) using asciidoctor.js to html-files within custom loaders in my webpack build. Therefore my entry is an asciidoc file and my final output is an html-file.
The issue that i am having is that i am not sure how to make webpack aware of the assets (like images) that i am including in my asciidoc files. After checking the compilation object in different compiler hooks, I discovered that my assets are not picked up by webpack and no NormalModules are created for them. This finally results in those assets not to be processed and ouput in the correct directories.
Because of those reasons my result is currently a correctly built html-file in the correct ouput dir but with the original paths to assets from the asciidoc file (which of course don't resolve because the assets don't exist in the output dir as they weren't even registered from webpack).
Ways of how i tried to solve the issue:
Write a custom Plugin that hooks into the compilation process (or Loader that checks the the current file) and manually create NormalModules when encountering paths to assets in asciidoc files. Those NormalModules should then in the end lead to an execution of the rules in my webpack config for the specific asset extension.
-> Failed because i was not able to find a way to manually create NormalModules and modify the moduleGraph accordingly. Closest of what i found wasLoaderContext.importModule()but it seems in order for this to work there already has to exist a NormalModule for this file-requestChange the format of how i include assets in asciidoc-files to use "require()" with the hope that webpack somehow picks it up and creates the NormalModules
-> Webpack did not pick it up and anyways it would be a terrible to write incorrect asciidoc for webpack to work
Questions:
- How do i make sure assets in any files (that are not the common like js, ts, html, css, etc) are resolved by webpack and NormalModules are created for them?
- Is there a something in the compilation or compiler api that i've missed that can help me achieve this?
I am no expert in webpack, so please excuse any conceptual errors i might have made and please enlighten me.
