169 lines
4.3 KiB
JavaScript
169 lines
4.3 KiB
JavaScript
const isProduction = process.env.NODE_ENV === 'production';
|
||
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
|
||
const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer');
|
||
const CompressionPlugin = require('compression-webpack-plugin')
|
||
const path = require('path');
|
||
|
||
module.exports = {
|
||
publicPath: './',
|
||
filenameHashing: true,
|
||
productionSourceMap: false,
|
||
parallel: require('os').cpus().length > 1,
|
||
lintOnSave: false,
|
||
devServer: {
|
||
hot: true,
|
||
hotOnly: true,
|
||
host: '0.0.0.0',
|
||
port: 9000,
|
||
compress: true,
|
||
open: true,
|
||
openPage: '#/',
|
||
overlay: {
|
||
warnings: true,
|
||
errors: true,
|
||
},
|
||
},
|
||
// pages: {
|
||
// index: {
|
||
// entry: 'src/core/run.ts',
|
||
// template: 'public/index.html',
|
||
// filename: 'index.html',
|
||
// title: 'H5 分享',
|
||
// chunks: ['chunk-vendors', 'chunk-common', 'index'],
|
||
// CurrentEnvironment: isProduction,
|
||
// cdn: {
|
||
// css: [
|
||
// 'https://cdn.bootcss.com/normalize/8.0.1/normalize.min.css',
|
||
// 'https://cdn.jsdelivr.net/npm/vant@2.2/lib/index.css',
|
||
// ],
|
||
// js: [
|
||
// 'https://cdn.bootcss.com/vue/2.6.10/vue.runtime.min.js',
|
||
// 'https://cdn.bootcss.com/vue-router/3.1.2/vue-router.min.js',
|
||
// 'https://cdn.bootcss.com/axios/0.19.0-beta.1/axios.min.js',
|
||
// 'https://cdn.jsdelivr.net/npm/vant@2.2/lib/vant.min.js'
|
||
// ],
|
||
// },
|
||
// },
|
||
// },
|
||
configureWebpack: (config) => {
|
||
// 设置程序核心入口
|
||
config.entry.app = './src/core/run/run.ts'
|
||
|
||
if (process.env.NODE_ENV === 'production') {
|
||
|
||
/**
|
||
* Gzip压缩
|
||
*/
|
||
config.mode = 'production'
|
||
return {
|
||
plugins: [new CompressionPlugin({
|
||
test: /\.js$|\.html$|\.css/, //匹配文件名
|
||
threshold: 10240, //对超过10k的数据进行压缩
|
||
deleteOriginalAssets: false //是否删除原文件
|
||
})]
|
||
}
|
||
|
||
/**
|
||
* 去除这些公共包，让webpack不打包到项目源码的js中，减小项目js体积
|
||
* 然后使用 pages 节点下的 cdn 数组里面的资源外链来引入。
|
||
*/
|
||
config.externals = {
|
||
vue: 'Vue',
|
||
'vue-router': 'VueRouter',
|
||
axios: 'axios',
|
||
Vant: 'Vant',
|
||
};
|
||
|
||
/**
|
||
* 部署阶段 代码压缩
|
||
*/
|
||
config.plugins.push(
|
||
// 生产环境自动删除console
|
||
new UglifyJsPlugin({
|
||
uglifyOptions: {
|
||
compress: {
|
||
warnings: false,
|
||
drop_debugger: true,
|
||
drop_console: true,
|
||
},
|
||
},
|
||
sourceMap: false,
|
||
parallel: true,
|
||
}),
|
||
);
|
||
|
||
// 开启 BundleAnalyzerPlugin
|
||
return {
|
||
plugins: [
|
||
new BundleAnalyzerPlugin(),
|
||
],
|
||
};
|
||
|
||
}
|
||
|
||
},
|
||
chainWebpack: (config) => {
|
||
|
||
/**
|
||
* 如果为打包发布，那么修改 html-webpack-plugin 配置
|
||
* 不取消 骨架屏 的节点注释 vue-ssr-outlet
|
||
*/
|
||
if (process.env.NODE_ENV === 'production') {
|
||
config.plugin('html').tap(opts => {
|
||
opts[0].minify.removeComments = false
|
||
return opts
|
||
})
|
||
}
|
||
|
||
|
||
/**
|
||
* 移除不必要的 prefetch 和 preload请求
|
||
*/
|
||
config.plugins.delete('prefetch');
|
||
config.plugins.delete('preload');
|
||
|
||
/**
|
||
* html 模板引擎 pug 配置
|
||
*/
|
||
config.module.rule('pug')
|
||
.test(/\.pug$/)
|
||
.use('pug-html-loader')
|
||
.loader('pug-html-loader')
|
||
.end();
|
||
|
||
|
||
/**
|
||
* 导入全局css
|
||
* @type {*[]}
|
||
*/
|
||
const types = ['vue-modules', 'vue', 'normal-modules', 'normal'];
|
||
types.forEach(type => addStyleResource(config.module.rule('stylus').oneOf(type)));
|
||
|
||
|
||
/**
|
||
* 配置路径别名，项目中引用资源的时候路径可以更简短
|
||
* 但是ts文件在用的时候，编译器会报错，需要添加 @ts-ignore
|
||
* 忽略开发工具的错误。
|
||
*/
|
||
config.resolve.alias
|
||
.set('@', resolve('src/view'))
|
||
.set('@core', resolve('src/core'))
|
||
.set('@assets', resolve('src/view/assets'));
|
||
}
|
||
|
||
};
|
||
|
||
function resolve(dir) {
|
||
return path.join(__dirname, dir);
|
||
}
|
||
|
||
function addStyleResource(rule) {
|
||
rule.use('style-resource')
|
||
.loader('style-resources-loader')
|
||
.options({
|
||
patterns: [
|
||
path.resolve(__dirname, './src/view/assets/stylus/imports.styl')
|
||
],
|
||
});
|
||
}
|