微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

webpack处理html中img标签引入图片不显示问题

@H_404_0@
{
        // 处理图片资源
        test: /\.(jpg|png|gif)$/,
        loader: 'file-loader',
        options: {
			// 关闭es6模块化
			esModule: false,
			
          limit: 20 * 1024,
          
          
          
		  name: '[hash:10].[ext]',
          outputPath: 'imgs'
        }
      },
      {
        // 处理html中img资源
        test: /\.html$/,
        loader: 'html-loader',
		options:{
		            esModule:false,
		                }
      },
      {
        // 处理其他资源
        exclude: /\.(html|js|css|less|jpg|png|gif)/,
        loader: 'file-loader',
        options: {
          name: '[hash:10].[ext]',
          outputPath: 'media'
        }
      }
    ]
  },

主要就是下面代码中的
{
// 处理html中img资源
test: /.html$/,
loader: ‘html-loader’,
options:{
esModule:false,
}

},

webpack5中在url-loader,html-loader,中都需要配置 esModule:false

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。

相关推荐