webpack打包html中图片不显示
程序员文章站
2022-03-03 13:51:00
...
html中直接使用img标签src加载图片的话,因为没有被依赖,图片不会被打包, 使用html-withimg-loader
module.exports = {
entry: './src/js/index.js',
// 打包后所有的输出都在build文件夹下
output: {
filename: 'js/built.js',
path: resolve(__dirname, 'build')
},
module: {
rules: [
// 处理html中的img资源
{
test: /\.html$/,
use: [
'html-withimg-loader',
// !!!!!注意:webpack5需要用html-withimg-loader打包才能显示
// 'html-loader',
],
// loader: 'html-loader',
},
]
},
}
推荐阅读
-
ImageGetter 显示 Html 中的图片_html/css_WEB-ITnose
-
如何让网页中图片等待5秒再显示_html/css_WEB-ITnose
-
关于在HTML表格中插入背景图片图片重复显示的问题_html/css_WEB-ITnose
-
网页中多个图标在一张图片上,使用css将各图标显示_html/css_WEB-ITnose
-
Android加载html中svg格式图片进行显示
-
Android加载html中svg格式图片进行显示
-
浅谈webpack打包过程中因为图片的路径导致的问题
-
基于webpack实现多html页面开发框架八 html引入图片打包和公共页面模块复用
-
终于解决了html中img标签图片不显示问题
-
html - Jquery PHP 如何实现SF中Markdown图片显示的功能?