html-withimg-loader与html-loader冲突

Question

1.使用了html-loader来加载代码片段
2.用html-withimg-loader 来打包html 里的Img
但是这两个loader 要冲突
正确加载片段 图片地址就不能正确打包
正确打包图片,html片段就不能加载

 <%= require('html-loader!./layout/html-head.html') %>



module: {
        loaders: [
            {
                test: /\.css$/,
                use: ExtractTextPlugin.extract({
                    fallback: "style-loader",
                    use: "css-loader"
                })
            },
            {
                test: /\.(gif|png|jpg|woff|svg|eot|ttf)\??.*$/,
                use: 'url-loader?limit=100&name=resource/[name].[ext]'
            },
            {
                test: /\.(htm|html)$/i,
                use: ['html-withimg-loader']
            }
        ]
    },

Answer 1

今天是2018-07-10，老衲也是遇到这个问题，但是已经解决

贴出方法 ，以助他人

其实很简单，就是楼主提到的：正确打包图片,html片段就不能加载

不需要用那个<% require%>的方法

直接在html中写： #include("./layout/top.html") 即可。

关于这个问题老衲折腾了大半个下午，现经测试可用。

另html-withimg-loader是老衲这几天才安装的，或许作者已经添加了新功能

详细看npm包地址：https://www.npmjs.com/package...

Answer 2

html-loader 是可以加载图片的，贴一下你的图片加载的代码

Answer 3

今天是2018-10-16，我也是这个问题，虽然html-loader可以达到效果，但是非常麻烦。
看到了一楼的解决方式确实实用。

html-loader要达到功能：
要去掉{

            test: /\.html$/,
            use: [{loader: 'html-loader'}]
        }

然后再在每个要添加的html的地方加<% require%>这个东西，关键图片也要这样加，图片多的时候就恶心了

你用html-withimg-loader，就轻松多了，就html复用的地方来一句 #include("./public/header.html")这样子
图片他自己会搞好，你不用管。