Important topic to understand is the difference between html-webpack-plugin and html-loader:
How does html-webpack-plugin work with html-loader?
Html loader home page: https://github.com/webpack-contrib/html-loader
Questions tagged [webpack-html-loader]
102 questions
2
votes
0 answers
Webpack html loader - load background image
Im using webpacks html-loader in combination with pug-html-loader, and its working fine for img tags with src attributes.
However if I have a div with an inline style="background-image: url()" attribute, the image referenced there is not…
Matthew
- 952
- 7
- 20
2
votes
3 answers
webpack html-loader： ![]()
tag not triggering url-loader
When using html-loader, the ![]()
tag in the index.html did not trigger url-loader. Here's my webpack configs & html:
webpack config
// webpack config
module.exports = {
entry: {
"index": path.join(__dirname, "./src/js/app.js"),
…
Bodhi Hu
- 196
- 4
- 11
2
votes
2 answers
How do I require an image in Pug using Webpack
I have the following config for my pug files...
{
test: /\.pug$/,
loaders: ["pug-html"]
}
This works great now I want to add an image that I load using url-loader. My structure is like this
src
...
thing
thing.template.pug
…
Jackie
- 21,969
- 32
- 147
- 289
2
votes
1 answer
Webpack doesn't bundle my HTML files
For some reason I currently don't understand, webpack does not bundle my HTML files into the bundles it generates. It bundles everything else, but sadly not my HTML files.
I'm using Angular 2, and have included a dependency on:
"html-loader":…
jeeves90
- 75
- 6
2
votes
1 answer
Webpack ngTemplate-loader won't include my templates into the bundle: how to debug?
I use webpack to build an angular project. My webpack configuration is copied from another project, where it works successfully.
But in my project it won't include .html templates into the resulting javascript bundle.
Here's the part of webpack…
Boris Burkov
- 13,420
- 17
- 74
- 109
1
vote
0 answers
Webpack 4 Child compilation failed: Module parse failed: Unexpected character '�' (1:0)
this is my first time using Webpack and I have a problem with it.
I get error message
ERROR in Error: Child compilation failed:
Module parse failed: Unexpected character '�' (1:0)
when I put image tag src in this way. I add a period before the…
CodeHada
- 27
- 4
1
vote
0 answers
How to fix "Child compilation failed" with webpack configuration and html-webpack-plugin
I encountered the following problems when configuring webpack. How can I solve them? I want to use my own index.html file.
My configuration file follows, the error message is at the bottom:
webpack.config.js:
module: {
rules: [
{
…
tony
- 11
- 3
1
vote
1 answer
Exporting the HTML into their own html file with html-loader and extract-loader
I am trying to convert the html file that would contain absolute paths in src. I found a similar problem in the webpack documentation. I try to use html-loader with extract-loader but gets an error.
html file -> simple.html
index js file :
import…
grzgrz
- 11
- 1
1
vote
1 answer
Why do i get this error in Webpack 5.11.0: 1 ERROR in child compilations?
so i get this error in my webpack code when trying to compile it, this happens when i start in production mode and when i delete html-loader the error is gone, i also include HtmlWebpackPlugin and file-loader to use :
webpack.prod.js:
const path =…
Joel Fernando
- 817
- 1
- 7
- 12
1
vote
1 answer
Is there any way in webpack html-loader preprocessor for HTML file interpolation?
I use the Webpack with html-loader, but since they removed the interpolation option my old projects can't follow the updates. There are serveral projects, so it would be too much effort to upgrade all of them to the new way.
Is there any way to use…
netdjw
- 5,419
- 21
- 88
- 162
1
vote
0 answers
Webpack html-loader error processing href in anchor tags
Has anyone gotten Webpack/html-loader to handle image references in anchor tags (href attribute)? I'm using the following webpack config that throws the error "Callback was already called" when the commented line below is included:
const path =…
Aaron
- 51
- 5
1
vote
2 answers
Webpack/html-loader tag href resolve
I've set up aliases in my webpack config file. It works fine for JS, CSS imports and img src attributes. However I'd like to build a gallery in the HTML file with the standard lightbox setup:
csisy
- 471
- 3
- 15
1
vote
1 answer
How to generate html template for static page from header/footer (and css/js inject) in Webpack 4 (lodash template not working)?
I'm trying to build static html pages with webpack 4. I'm using html-webpack-plugin. I want to define some header.html and footer.html and import them later in all html pages. But I want also then my output js and css files automatically inject to…
Pavel Kizernis
- 21
- 1
- 9
1
vote
0 answers
How do I fix [object Object] in rel=stylesheet in webpack output?
When I tried to webpack my project, I'm getting this error my expected output for CSS styles ./styles.css.
I'm new to webpack, Can anyone please help me to solve this issue. Thanks in advance.
Here are…
Vamsi Krishna
- 11
- 1
1
vote
0 answers
DefinePlugin not running immediately after html-loader
I’m trying to use DefinePlugin with html-loader. I’m using interpolation in html-loader, and trying to use values from DefinePlugin in the interpolated expressions.
This works when I load into HtmlWebpackPlugin, or when html-loader is the only…
NReilingh
- 1,730
- 17
- 32