jp-commuter-ds/vue.config.js

const path = require('path');

const CompressionWebpackPlugin = require("compression-webpack-plugin")
const productionGzipExtensions = ['js', 'css']

function resolve(dir) {
	return path.join(__dirname, dir)
}

let title = '';
if (process.env.VUE_APP_NODE_NAME == 'production') {
	title = ''
} else if (process.env.VUE_APP_NODE_NAME == 'test') {
	title = '(测试)'
} else {
	title = '(开发)'
}

const Timestamp = new Date().getTime();
module.exports = {
	publicPath: './',
	outputDir: 'dist/' + process.env.NODE_ENV,
	assetsDir: 'static',
	lintOnSave: false,
	devServer: {
		host: 'localhost',
		port: 80,
		//解析缓存
		disableHostCheck: true,
		//支持gzip
		compress: true,
	},
	//不输出map
	productionSourceMap: false,
	chainWebpack: (config) => {
		config.entry.app = ['babel-polyfill', './src/main.js']
		config.resolve.alias
			.set('@', resolve('./static/'))

		config.plugins.delete('preload-index');
		config.plugins.delete('prefetch-index');
		
		config.optimization.minimize(true);
	},
	configureWebpack: config => {
		/* //开启gzip压缩,需要配置Nginx服务器gzip选项开启
		config.plugins.push(
			new CompressionWebpackPlugin({
				filename: '[path].gz[query]',
				algorithm: 'gzip',
				test: new RegExp('\\.(' + productionGzipExtensions.join('|') + ')$'),
				threshold: 10240,
				minRatio: 0.8
			})
		); */

		config.output.filename = `./static/js/[name].${Timestamp}.js`
		config.output.chunkFilename = `./static/js/[name].${Timestamp}.js`

		config.performance = {
			hints: 'warning',
			//入口起点的最大体积 整数类型（以字节为单位）
			maxEntrypointSize: 50000000,
			//生成文件的最大体积 整数类型（以字节为单位 300k）
			maxAssetSize: 30000000,
			//只给出 js 文件的性能提示
			assetFilter: function(assetFilename) {
				return assetFilename.endsWith('.js');
			}
		}
	},
	css: {
		extract: {
			filename: `./static/css/[name].${Timestamp}.css`,
			chunkFilename: `./static/css/[name].${Timestamp}.css`
		},
		sourceMap: false,
		loaderOptions: {
			// 给 sass-loader 传递选项
			sass: {
				// @/ 是 src/ 的别名
				// prependData: `@import "@/assets/scss/base.scss";`
			}
		}
	}
};