webpack 生产环境配置(无注释)
const { resolve } = require(‘path‘)
const MiniCssExtractPlugin =require(‘mini-css-extract-plugin‘)
const HtmlWebpackPlugin = require(‘html-webpack-plugin‘)
const OptimizeCssAssetsWebpackPlugin = require(‘optimize-css-assets-webpack-plugin‘)
process.env.NODE_ENV = ‘production‘;
const commenCssLoader=[
MiniCssExtractPlugin.loader,
‘css-loader‘,
{
loader:‘postcss-loader‘,
options: {
ident: ‘postcss‘,//默认配置
plugins: () => [
require(‘postcss-preset-env‘)()
]
}
},
]
module.exports ={
entry:‘./src/js/index.js‘,
output:{
filename:‘js/built.js‘,
path:resolve(__dirname,‘build‘)
},
module:{
rules:[
{
test:/\.css$/,
use:[...commenCssLoader]
},
{
test:/\.less$/,
use:[...commenCssLoader,‘less-loader‘]
},
{
test:/\.js$/,
exclude:/node_modules/,
use:[
{
loader:‘babel-loader‘,
options:{
presets:[
[
‘@babel/preset-env‘,
{
useBuiltIns:‘usage‘,
corejs:{version:3},
targets:{
chrome:‘70‘,
firefox:‘62‘,
ie:‘9‘,
safari:‘10‘,
edge:‘17‘,
}
}
]
]
}
},
{
// //优先执行
// enforce:‘pre‘,
loader:‘eslint-loader‘,
options:{
fix:true
}
},
]
},
{
test:/\.(jpg|png|gif)$/,
loader:‘url-loader‘,
options:{
limit:8*1024,
name:‘[hash:10].[ext]‘,
outputPath:‘imgs‘,
//esModule:false
}
},
{
test:/\.html$/,
loader:‘html-loader‘
},
{
exclude:/\.(css|html|js|jpg|png|gif|less|sass)$/,
loader:‘file-loader‘,
options:{
name:‘[hash:10].[ext]‘,
outputPath:‘media‘//配置输出文件夹
}
}
]
},
plugins:[
new HtmlWebpackPlugin({
template:‘./src/index.html‘,
minify: {
collapseWhitespace:true,
removeComments:true,
}
}),
new MiniCssExtractPlugin({
filename:‘css/built.css‘
}),
new OptimizeCssAssetsWebpackPlugin()
],
mode:‘production‘,
devServer:{
contentBase:resolve(__dirname,‘build.js‘),
compress:true,
port:3000,
open:true,
}
} 相关推荐
不知道该写啥QAQ 2020-11-12
webfullStack 2020-11-09
Yvettre 2020-09-15
想做大牛的蜗牛 2020-10-30
gaojie0 2020-09-11
SelinaChan 2020-08-14
不知道该写啥QAQ 2020-08-09
gloria0 2020-08-09
不知道该写啥QAQ 2020-08-02
hline 2020-07-29
SelinaChan 2020-07-28
wangdianyong 2020-07-23
webpackvuees 2020-07-23
yqoxygen 2020-07-20
不知道该写啥QAQ 2020-07-18
waterv 2020-07-18