ZhangShan_VueProject/vue.config.js

const webpack = require("webpack");
const path = require("path");
const CompressionWebpackPlugin = require("compression-webpack-plugin");

let env = process.env.NODE_ENV;
module.exports = {
	// 如果是hash模式
	publicPath: env !== "development" ? "./" : "/",
	
	// 如果是history模式
	// publicPath: env !== "development" ? "/" : "/",

	// 静态资源目录 (js, css, img, fonts)
	assetsDir: "assets",

	//关键点在这  原来的 Compiler 换成了 runtimeCompiler
	runtimeCompiler: true,

	//设置打包之后是否打包.map文件
	productionSourceMap: env !== "development" ? false : true,

	// 输出文件目录
	outputDir: "dist",
	// 让样式找到源
	css: {
		sourceMap: true
	},
	devServer: {
		port: 8083,
		host: "0.0.0.0",
		hot: true,
		open: false,
		disableHostCheck: true,
		proxy: {
			"/api": {
				target: "127.0.0.1", //对应跨域的接口
				changeOrigin: true,
				ws: false,
				pathRewrite: {
					"^/api": ""
				}
			},
			'/restfull': {
                target: "http://192.168.0.238:8033",//"http://172.168.1.8:8075", // 报警服务
                changeOrigin: true, // 在本地会创建一个虚拟服务端，然后发送请求的数据，并同时接收请求的数据，这样服务端和服务端进行数据的交互就不会有跨域问题
                pathRewrite: {  // 路径重写，
                    '^/restfull': ''  // 替换target中的请求地址，也就是说以后你在请求http://api.douban.com/v2/XXXXX这个地址的时候直接写成/api即可。
                }
            },
		}
	},

	chainWebpack: config => {
		config.resolve.alias.set("@", path.resolve(__dirname, "./src"));
	},

	configureWebpack: config => {
		if (env !== "development") {
			// 配置打包 压缩js
			config.plugins.push(
				new CompressionWebpackPlugin({
					algorithm: "gzip",
					test: /\.js$|\.html$|.\css/, //匹配文件名
					threshold: 10240, //对超过10k的数据压缩
					deleteOriginalAssets: false, //不删除源文件
					minRatio: 0.8
				})
			);
		}
	}
};