1. 程式人生 > >Webpack如何打包html圖片

Webpack如何打包html圖片

1.安裝npm i -D html-loader 和 npm install url-loader --save-dev;

2.在webpack.config.js裡的module模組引入如下程式碼:

{
                test: /\.(png|svg|jpg|gif)$/i,
                loaders: [
                    'url-loader?limit=100000&name=images/[name].[ext]'//指定圖片存放位置
                ]
            },
            {
                  test: /\.(html)$/,
                  use: {
                   loader: 'html-loader',
                   options: {
                         attrs: ['img:src', 'img:data-src', 'audio:src']//html圖片輸出
                         // minimize:true
                   }
                  }
            }