This loader hasn't been updated since last year and doesn't seem to support webpack 5.
For example, I could not find a solution for my problem of using ejs-loader and html-loader at the same time.
My current config with webpack 4 is something like:
{
test: /\.ejs$/i,
use: [
{
loader: 'ejs-loader',
options: {
variable: 'data',
}
},
'extract-loader',
'html-loader',
]
}
First, I process the ejs files through html-loader so that the webpack knows about static files (img src="/something.jpg", etc.). Then I pass output to extract-loader, which extracts the module back to html/ejs strings. Then the processed .ejs passed into ejs-loader.
html-loader >= 2.0 exports HTML as modules, added new URL syntax and uses parse5 for parsing ejs files.
Next, extract-loader is not supported since May 2020 and is therefore not compatible with webpack 5. html-loader has an idea to add an option for similar functionality, this will partially solve the problem of extract-loader.
But even after that, it will not be possible to use html-loader anymore, since now it checks html tags more strictly and it will not allow to use ejs templates as before.
A simple example of how it is used now (data comes from the backend):
<span>Hello, <%- data.username %></span>
<img src="/images/user.jpg">
import template from "templates/sample.ejs";
// process response from backend
let output = template({ username: response.username });
Therefore, the question is how to similarly use webpack 5 with compiled ejs templates, while pre-processing the source templates to process them to the webpack (which is what the html-loader is doing now). Developers of html-loader says that other loaders like ejs-loader should do this, and html-loader loader will only support correct html tags.
This loader hasn't been updated since last year and doesn't seem to support webpack 5.
For example, I could not find a solution for my problem of using
ejs-loaderandhtml-loaderat the same time.My current config with webpack 4 is something like:
First, I process the ejs files through
html-loaderso that the webpack knows about static files (img src="/something.jpg", etc.). Then I pass output toextract-loader, which extracts the module back to html/ejs strings. Then the processed .ejs passed intoejs-loader.html-loader>= 2.0 exports HTML as modules, addednew URLsyntax and usesparse5for parsing ejs files.Next,
extract-loaderis not supported since May 2020 and is therefore not compatible with webpack 5.html-loaderhas an idea to add an option for similar functionality, this will partially solve the problem ofextract-loader.But even after that, it will not be possible to use
html-loaderanymore, since now it checks html tags more strictly and it will not allow to use ejs templates as before.A simple example of how it is used now (data comes from the backend):
Therefore, the question is how to similarly use webpack 5 with compiled ejs templates, while pre-processing the source templates to process them to the webpack (which is what the
html-loaderis doing now). Developers ofhtml-loadersays that other loaders likeejs-loadershould do this, andhtml-loaderloader will only support correct html tags.