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

 1 {
 2         // 处理图片资源
 3         test: /\.(jpg|png|gif)$/,
 4         loader: 'file-loader',
 5         options: {
 6             // 关闭es6模块化
 7             esModule: false,
 8             
 9           limit: 20 * 1024,
10           
11           
12           
13           name: '[hash:10].[ext]',
14           outputPath: 'imgs'
15         }
16       },
17       {
18         // 处理html中img资源
19         test: /\.html$/,
20         loader: 'html-loader',
21         options:{
22                     esModule:false,
23                         }
24       },
25       {
26         // 处理其他资源
27         exclude: /\.(html|js|css|less|jpg|png|gif)/,
28         loader: 'file-loader',
29         options: {
30           name: '[hash:10].[ext]',
31           outputPath: 'media'
32         }
33       }
34     ]
35   },

主要就是21，22，23行

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

posted @ 2021-05-27 13:15  陈小歪、  阅读(470)  评论(0)  编辑  收藏  举报