From dcc267ab9c160fd70a2e344f618df334bccb2099 Mon Sep 17 00:00:00 2001 From: zwq Date: Fri, 29 Oct 2021 09:54:58 +0800 Subject: [PATCH] =?UTF-8?q?=E6=8F=90=E4=BA=A4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- vue.config.js | 188 ++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 188 insertions(+) create mode 100644 vue.config.js diff --git a/vue.config.js b/vue.config.js new file mode 100644 index 0000000..adf54d5 --- /dev/null +++ b/vue.config.js @@ -0,0 +1,188 @@ +'use strict' +const path = require('path') +const defaultSettings = require('./src/settings.js') + +function resolve(dir) { + return path.join(__dirname, dir) +} + +const name = defaultSettings.title || 'vue Element Admin' // page title + +// If your port is set to 80, +// use administrator privileges to execute the command line. +// For example, Mac: sudo npm run +// You can change the port by the following method: +// port = 9527 npm run dev OR npm run dev --port = 9527 +const port = process.env.port || process.env.npm_config_port || 9527 // dev port +// All configuration item explanations can be find in https://cli.vuejs.org/config/ +module.exports = { + /** + * You will need to set publicPath if you plan to deploy your site under a sub path, + * for example GitHub Pages. If you plan to deploy your site to https://foo.github.io/bar/, + * then publicPath should be set to "/bar/". + * In most cases please use '/' !!! + * Detail: https://cli.vuejs.org/config/#publicpath + */ + publicPath: '', + outputDir: 'dist', + assetsDir: 'static', + lintOnSave: process.env.NODE_ENV === 'development', + productionSourceMap: false, + devServer: { + port: port, + open: false, + overlay: { + warnings: false, + errors: true + }, + // allowedHosts: ['192.168.0.104:8080', '192.168.0.104:8081'], + // headers: { + // 'Access-Control-Allow-Origin': '192.168.0.104:8080, 192.168.0.104:8081', + // 'Access-Control-Allow-Headers': '*', + // 'Access-Control-Allow-Methods': '*', + // 'Access-Control-Allow-Credentials': 'true' + // }, + // before: require('./mock/mock-server.js'), + // 这里写入需要代理的api和对应的目标地址 + proxy: { + '/api': { + target: 'http://cigs.mes.picaiba.com', + // target: 'http://192.168.0.127:8080', + // target: 'http://192.168.0.165:8080', + // target: 'http://192.168.43.105:8080', + // target: 'http://127.0.0.1:8080', + // target: 'http://192.168.0.70:8080', + // target: 'http://192.168.0.199:8080', + + ws: true, + changeOrigin: true, + pathRewrite: { + '^/portapi': '' + } + // 使用了proxy 就需要开启下面的选项 (http-proxy-middleware会将post请求给parse了 所以需要再次进行string化) + // onProxyReq: (proxyReq, req, res, options) => { + // if (req.body) { + // const bodyData = JSON.stringify(req.body) + // // incase if content-type is application/x-www-form-urlencoded -> we need to change to application/json + // proxyReq.setHeader('Content-Type', 'application/json') + // proxyReq.setHeader('Content-Length', Buffer.byteLength(bodyData)) + // // stream the content + // proxyReq.write(bodyData) + // } + // } + }, + '/spc': { + target: 'http://58.210.206.230:8000', + // target: 'http://192.168.0.187:8080', + // target: 'http://192.168.43.105:8080', + // target: 'http://127.0.0.1:8080', + ws: true, + changeOrigin: true, + pathRewrite: { + '^/spc': '' + } + // 使用了proxy 就需要开启下面的选项 (http-proxy-middleware会将post请求给parse了 所以需要再次进行string化) + // onProxyReq: (proxyReq, req, res, options) => { + // if (req.body) { + // const bodyData = JSON.stringify(req.body) + // // incase if content-type is application/x-www-form-urlencoded -> we need to change to application/json + // proxyReq.setHeader('Content-Type', 'application/json') + // proxyReq.setHeader('Content-Length', Buffer.byteLength(bodyData)) + // // stream the content + // proxyReq.write(bodyData) + // } + // } + } + } + }, + configureWebpack: { + // provide the app's title in webpack's name field, so that + // it can be accessed in index.html to inject the correct title. + name: name, + resolve: { + alias: { + '@': resolve('src') + } + } + }, + css: { + loaderOptions: { + // vue cli默认使用node-sass作为sass预处理器，使用下面的选项可以使用sass包作为预处理器 + // 用于解决node-sass需要从外网下载依赖的卡顿问题 + sass: { + implementation: require('sass') + } + } + }, + chainWebpack(config) { + config.plugins.delete('preload') // TODO: need test + config.plugins.delete('prefetch') // TODO: need test + + // set svg-sprite-loader + config.module + .rule('svg') + .exclude.add(resolve('src/icons')) + .end() + config.module + .rule('icons') + .test(/\.svg$/) + .include.add(resolve('src/icons')) + .end() + .use('svg-sprite-loader') + .loader('svg-sprite-loader') + .options({ + symbolId: 'icon-[name]' + }) + .end() + + // set preserveWhitespace + config.module + .rule('vue') + .use('vue-loader') + .loader('vue-loader') + .tap(options => { + options.compilerOptions.preserveWhitespace = true + return options + }) + .end() + + config + .when(process.env.NODE_ENV !== 'development', + config => { + config + .plugin('ScriptExtHtmlWebpackPlugin') + .after('html') + .use('script-ext-html-webpack-plugin', [{ + // `runtime` must same as runtimeChunk name. default is `runtime` + inline: /runtime\..*\.js$/ + }]) + .end() + config + .optimization.splitChunks({ + chunks: 'all', + cacheGroups: { + libs: { + name: 'chunk-libs', + test: /[\\/]node_modules[\\/]/, + priority: 10, + chunks: 'initial' // only package third parties that are initially dependent + }, + elementUI: { + name: 'chunk-elementUI', // split elementUI into a single package + priority: 20, // the weight needs to be larger than libs and app or it will be packaged into libs or app + test: /[\\/]node_modules[\\/]_?element-ui(.*)/ // in order to adapt to cnpm + }, + commons: { + name: 'chunk-commons', + test: resolve('src/components'), // can customize your rules + minChunks: 3, // minimum common number + priority: 5, + reuseExistingChunk: true + } + } + }) + config.optimization.runtimeChunk('single') + } + ) + } +}