1 'use strict' 2 const path = require('path') 3 const defaultSettings = require('./src/settings.js') 4 5 function resolve(dir) { 6 return path.join(__dirname, dir) 7 } 8 9 const name = defaultSettings.title || '中通服人力绩效管理系统' // page title 10 11 // If your port is set to 80, 12 // use administrator privileges to execute the command line. 13 // For example, Mac: sudo npm run 14 // You can change the port by the following methods: 15 // port = 9528 npm run dev OR npm run dev --port = 9528 16 const port = process.env.port || process.env.npm_config_port || 9568 // dev port 17 18 // All configuration item explanations can be find in https://cli.vuejs.org/config/ 19 module.exports = { 20 /** 21 * You will need to set publicPath if you plan to deploy your site under a sub path, 22 * for example GitHub Pages. If you plan to deploy your site to https://foo.github.io/bar/, 23 * then publicPath should be set to "/bar/". 24 * In most cases please use '/' !!! 25 * Detail: https://cli.vuejs.org/config/#publicpath 26 */ 27 // transpileDependencies: ['element-ui'], 28 publicPath: '/ccs-hr/', 29 outputDir: 'dist', 30 assetsDir: 'static', 31 lintOnSave: process.env.NODE_ENV === 'development', 32 productionSourceMap: false, 33 devServer: { 34 port: port, 35 // open: true, 36 overlay: { 37 warnings: false, 38 errors: true 39 }, 40 proxy: { 41 // change xxx-api/login => mock/login 42 // detail: https://cli.vuejs.org/config/#devserver-proxy 43 [process.env.VUE_APP_BASE_API]: { 44 target: `http://127.0.0.1:${port}/mock`, 45 changeOrigin: true, 46 pathRewrite: { 47 ['^' + process.env.VUE_APP_BASE_API]: '' 48 } 49 } 50 }, 51 after: require('./mock/mock-server.js') 52 }, 53 configureWebpack: { 54 // provide the app's title in webpack's name field, so that 55 // it can be accessed in index.html to inject the correct title. 56 name: name, 57 resolve: { 58 alias: { 59 '@': resolve('src') 60 } 61 } 62 }, 63 chainWebpack(config) { 64 config.plugins.delete('preload') // TODO: need test 65 config.plugins.delete('prefetch') // TODO: need test 66 config.entry('main').add('babel-polyfill') // main是入口js文件 67 68 // set svg-sprite-loader 69 config.module 70 .rule('svg') 71 .exclude.add(resolve('src/icons')) 72 .end() 73 config.module 74 .rule('icons') 75 .test(/.svg$/) 76 .include.add(resolve('src/icons')) 77 .end() 78 .use('svg-sprite-loader') 79 .loader('svg-sprite-loader') 80 .options({ 81 symbolId: 'icon-[name]' 82 }) 83 .end() 84 85 // set preserveWhitespace 86 config.module 87 .rule('vue') 88 .use('vue-loader') 89 .loader('vue-loader') 90 .tap(options => { 91 options.compilerOptions.preserveWhitespace = true 92 return options 93 }) 94 .end() 95 96 config 97 // https://webpack.js.org/configuration/devtool/#development 98 .when(process.env.NODE_ENV === 'development', 99 config => config.devtool('cheap-source-map') 100 ) 101 102 config 103 .when(process.env.NODE_ENV !== 'development', 104 config => { 105 config 106 .plugin('ScriptExtHtmlWebpackPlugin') 107 .after('html') 108 .use('script-ext-html-webpack-plugin', [{ 109 // `runtime` must same as runtimeChunk name. default is `runtime` 110 inline: /runtime..*.js$/ 111 }]) 112 .end() 113 config 114 .optimization.splitChunks({ 115 chunks: 'all', 116 cacheGroups: { 117 libs: { 118 name: 'chunk-libs', 119 test: /[\/]node_modules[\/]/, 120 priority: 10, 121 chunks: 'initial' // only package third parties that are initially dependent 122 }, 123 elementUI: { 124 name: 'chunk-elementUI', // split elementUI into a single package 125 priority: 20, // the weight needs to be larger than libs and app or it will be packaged into libs or app 126 test: /[\/]node_modules[\/]_?element-ui(.*)/ // in order to adapt to cnpm 127 }, 128 commons: { 129 name: 'chunk-commons', 130 test: resolve('src/components'), // can customize your rules 131 minChunks: 3, // minimum common number 132 priority: 5, 133 reuseExistingChunk: true 134 } 135 } 136 }) 137 config.optimization.runtimeChunk('single') 138 } 139 ) 140 } 141 }