webpack 轻量级打包配置


const HtmlWebpackPlugin = require('html-webpack-plugin'); const CopyWebpackPlugin = require('copy-webpack-plugin'); const ExtractTextWebpackPlugin = require('extract-text-webpack-plugin'); module.exports = { mode:'production', entry:{ main:'./src/main.js' }, output:{ // 输入的根目录 path: __dirname + '/dist', filename:'[hash].js' }, module: { rules: [ {
     //css 自动加前缀还要配合postcss配置 test: /.css$/, use: [ { loader:"style-loader", // options: { // autoprefixer: false // } }, { loader:"css-loader", options: { autoprefixer: true } }], }, { test: /.scss$/, // use: ['style-loader','css-loader','sass-loader'], loader:ExtractTextWebpackPlugin.extract(['css-loader','postcss-loader','sass-loader']) }, { test: /.(png|jpe?g|gif|svg)(?.*)?$/, loader: 'url-loader', options: { limit: 13000, // name 表示输出的地方,相对于输出根目录 name: 'img/[name].[hash:7].[ext]', publicPath:'../' //在生成的文件引用,前面加 } }, { test: /.html$/, loader: "html-loader" } ] }, plugins: [ new HtmlWebpackPlugin({ template: './src/index.html', // inject: 引入模块的注入位置;取值有true/false/body/head minify:true }), new CopyWebpackPlugin([ {from:'./src/vendor',to:'./js'} ]), // css 样式分离不能HMR new ExtractTextWebpackPlugin("css/[name].[hash:7].css") ] }
原文地址:https://www.cnblogs.com/xuezizhenchengxuyuan/p/9120225.html