webpack 生产环境配置(无注释)
2021-02-10 05:16
标签:output rem bpa for enc url ESS 生产 roc webpack 生产环境配置(无注释) 标签:output rem bpa for enc url ESS 生产 roc 原文地址:https://www.cnblogs.com/hllzww/p/13053758.htmlconst { 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,
}
}
上一篇:MVC、MVP、MVVM
下一篇:Ajax七
文章标题:webpack 生产环境配置(无注释)
文章链接:http://soscw.com/index.php/essay/53421.html