修改webpack配置

This commit is contained in:
结发受长生 2019-05-17 15:51:06 +08:00
parent e9c28a3cc4
commit a56e371bb0
4 changed files with 101 additions and 97 deletions

View File

@ -3,7 +3,7 @@
"version": "5.1.0",
"description": "Hexo响应式主题",
"scripts": {
"dev": "webpack --watch --progress --mode development",
"dev": "webpack --progress --mode development",
"build": "webpack -p --mode production"
},
"repository": {

View File

@ -4,5 +4,5 @@
<% for (let index in htmlWebpackPlugin.files.css) { %>
<% let cssFile = htmlWebpackPlugin.files.css[index] %>
<%= `${left} css('${cssFile.substr(cssFile.indexOf("css"),cssFile.length)}') ${right}${right2}` %>
<%= `${left} css('${cssFile}') ${right}${right2}` %>
<% } %>

View File

@ -2,6 +2,7 @@
<% var right = '%' %>
<% var right2 = '>' %>
<% for (let chunk in htmlWebpackPlugin.files.chunks) { %>
<%= `${left} js('js/${chunk}.${htmlWebpackPlugin.files.chunks[chunk].hash.substr(0,8)}.js') ${right}${right2}` %>
<% for (let index in htmlWebpackPlugin.files.js) { %>
<% let jsFile = htmlWebpackPlugin.files.js[index] %>
<%= `${left} js('${jsFile}') ${right}${right2}` %>
<% } %>

View File

@ -10,18 +10,21 @@ const minifyHTML = {
minifyJS:true
}
module.exports = {
module.exports = function(env, argv) {
// 是否是生产环境
let isProd = argv.mode === 'production'
return {
entry: {
main: "./source-src/js/main.js",
slider: "./source-src/js/slider.js",
mobile: ["babel-polyfill", "./source-src/js/mobile.js"],
viewer: "./source-src/js/viewer.js",
waifu: "./source-src/js/waifu.js"
main: './source-src/js/main.js',
slider: './source-src/js/slider.js',
mobile: ['babel-polyfill', './source-src/js/mobile.js'],
viewer: './source-src/js/viewer.js',
waifu: './source-src/js/waifu.js'
},
output: {
publicPath: '/',
path: __dirname+"/source",
filename: "js/[name].[chunkhash:8].js"
path: __dirname+'/source',
filename: isProd ? 'js/[name].[chunkhash].js' : 'js/[name].js'
},
module: {
rules: [
@ -36,36 +39,35 @@ module.exports = {
test: /\.(scss|sass)$/,
use: [
MiniCssExtractPlugin.loader,
"css-loader",
"postcss-loader",
"sass-loader"
'css-loader',
'postcss-loader',
'sass-loader'
]
},{
test: /\.css$/,
use: [
MiniCssExtractPlugin.loader,
"css-loader",
"postcss-loader"
'css-loader',
'postcss-loader'
]
},{
test: /\.(png|jpe?g|gif|ico)$/,
use: {
loader: "url-loader",
loader: 'url-loader',
options: {
limit: 1000,
publicPath: "../",
name: "images/[name].[ext]"
publicPath: '../',
name: 'images/[name].[ext]'
}
}
},{
test: /\.(svg|eot|ttf|woff2?|otf)$/,
use: {
loader: "url-loader",
loader: 'url-loader',
options: {
limit: 1000,
publicPath: "../",
name: "fonts/[name].[hash:6].[ext]"
publicPath: '../',
name: 'fonts/[name].[hash:6].[ext]'
}
}
}
@ -73,8 +75,8 @@ module.exports = {
},
plugins: [
new MiniCssExtractPlugin({
filename: "css/[name].[contenthash:8].css",
chunkFilename: "[id].css"
filename: isProd ? 'css/[name].[contenthash].css' : 'css/[name].css',
chunkFilename: '[id].css'
}),
new OptimizeCssAssetsPlugin({
assetNameRegExp: /viewer\..*?\.css$/g,
@ -102,5 +104,6 @@ module.exports = {
dry: false,
})
],
// watch: true
watch: !isProd
}
}