Commit 27067a70d3df3508796b64b2c387dbed7684f3b4
1 parent
fedf6da380
Exists in
master
外网开放
Showing
1 changed file
with
2 additions
and
0 deletions
Show diff stats
vue.config.js
| 1 | 'use strict' | 1 | 'use strict' |
| 2 | const path = require('path') | 2 | const path = require('path') |
| 3 | const defaultSettings = require('./src/settings.js') | 3 | const defaultSettings = require('./src/settings.js') |
| 4 | 4 | ||
| 5 | function resolve(dir) { | 5 | function resolve(dir) { |
| 6 | return path.join(__dirname, dir) | 6 | return path.join(__dirname, dir) |
| 7 | } | 7 | } |
| 8 | 8 | ||
| 9 | const name = defaultSettings.title || 'vue Element Admin' // page title | 9 | const name = defaultSettings.title || 'vue Element Admin' // page title |
| 10 | 10 | ||
| 11 | // If your port is set to 80, | 11 | // If your port is set to 80, |
| 12 | // use administrator privileges to execute the command line. | 12 | // use administrator privileges to execute the command line. |
| 13 | // For example, Mac: sudo npm run | 13 | // For example, Mac: sudo npm run |
| 14 | // You can change the port by the following method: | 14 | // You can change the port by the following method: |
| 15 | // port = 9527 npm run dev OR npm run dev --port = 9527 | 15 | // port = 9527 npm run dev OR npm run dev --port = 9527 |
| 16 | const port = process.env.port || process.env.npm_config_port || 9527 // dev port | 16 | const port = process.env.port || process.env.npm_config_port || 9527 // dev port |
| 17 | 17 | ||
| 18 | // All configuration item explanations can be find in https://cli.vuejs.org/config/ | 18 | // All configuration item explanations can be find in https://cli.vuejs.org/config/ |
| 19 | module.exports = { | 19 | module.exports = { |
| 20 | /** | 20 | /** |
| 21 | * You will need to set publicPath if you plan to deploy your site under a sub path, | 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/, | 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/". | 23 | * then publicPath should be set to "/bar/". |
| 24 | * In most cases please use '/' !!! | 24 | * In most cases please use '/' !!! |
| 25 | * Detail: https://cli.vuejs.org/config/#publicpath | 25 | * Detail: https://cli.vuejs.org/config/#publicpath |
| 26 | */ | 26 | */ |
| 27 | publicPath: '/', | 27 | publicPath: '/', |
| 28 | outputDir: 'dist', | 28 | outputDir: 'dist', |
| 29 | assetsDir: 'static', | 29 | assetsDir: 'static', |
| 30 | lintOnSave: process.env.NODE_ENV === 'development', | 30 | lintOnSave: process.env.NODE_ENV === 'development', |
| 31 | productionSourceMap: false, | 31 | productionSourceMap: false, |
| 32 | devServer: { | 32 | devServer: { |
| 33 | port: port, | 33 | port: port, |
| 34 | open: true, | 34 | open: true, |
| 35 | public: require('os').networkInterfaces()[Object.keys(require('os').networkInterfaces())[0]][1].address + ':8080', | ||
| 36 | disableHostCheck: true, | ||
| 35 | overlay: { | 37 | overlay: { |
| 36 | warnings: false, | 38 | warnings: false, |
| 37 | errors: true | 39 | errors: true |
| 38 | }, | 40 | }, |
| 39 | before: require('./mock/mock-server.js') | 41 | before: require('./mock/mock-server.js') |
| 40 | }, | 42 | }, |
| 41 | configureWebpack: { | 43 | configureWebpack: { |
| 42 | // provide the app's title in webpack's name field, so that | 44 | // provide the app's title in webpack's name field, so that |
| 43 | // it can be accessed in index.html to inject the correct title. | 45 | // it can be accessed in index.html to inject the correct title. |
| 44 | name: name, | 46 | name: name, |
| 45 | resolve: { | 47 | resolve: { |
| 46 | alias: { | 48 | alias: { |
| 47 | '@': resolve('src') | 49 | '@': resolve('src') |
| 48 | } | 50 | } |
| 49 | } | 51 | } |
| 50 | }, | 52 | }, |
| 51 | chainWebpack(config) {//链式打包 | 53 | chainWebpack(config) {//链式打包 |
| 52 | config.plugins.delete('preload') // TODO: need test | 54 | config.plugins.delete('preload') // TODO: need test |
| 53 | config.plugins.delete('prefetch') // TODO: need test | 55 | config.plugins.delete('prefetch') // TODO: need test |
| 54 | 56 | ||
| 55 | // set svg-sprite-loader | 57 | // set svg-sprite-loader |
| 56 | config.module | 58 | config.module |
| 57 | .rule('svg') | 59 | .rule('svg') |
| 58 | .exclude.add(resolve('src/icons')) | 60 | .exclude.add(resolve('src/icons')) |
| 59 | .end() | 61 | .end() |
| 60 | config.module | 62 | config.module |
| 61 | .rule('icons') | 63 | .rule('icons') |
| 62 | .test(/\.svg$/) | 64 | .test(/\.svg$/) |
| 63 | .include.add(resolve('src/icons')) | 65 | .include.add(resolve('src/icons')) |
| 64 | .end() | 66 | .end() |
| 65 | .use('svg-sprite-loader') | 67 | .use('svg-sprite-loader') |
| 66 | .loader('svg-sprite-loader') | 68 | .loader('svg-sprite-loader') |
| 67 | .options({ | 69 | .options({ |
| 68 | symbolId: 'icon-[name]' | 70 | symbolId: 'icon-[name]' |
| 69 | }) | 71 | }) |
| 70 | .end() | 72 | .end() |
| 71 | 73 | ||
| 72 | // set preserveWhitespace | 74 | // set preserveWhitespace |
| 73 | config.module | 75 | config.module |
| 74 | .rule('vue') | 76 | .rule('vue') |
| 75 | .use('vue-loader') | 77 | .use('vue-loader') |
| 76 | .loader('vue-loader') | 78 | .loader('vue-loader') |
| 77 | .tap(options => { | 79 | .tap(options => { |
| 78 | options.compilerOptions.preserveWhitespace = true | 80 | options.compilerOptions.preserveWhitespace = true |
| 79 | return options | 81 | return options |
| 80 | }) | 82 | }) |
| 81 | .end() | 83 | .end() |
| 82 | 84 | ||
| 83 | config | 85 | config |
| 84 | // https://webpack.js.org/configuration/devtool/#development | 86 | // https://webpack.js.org/configuration/devtool/#development |
| 85 | .when(process.env.NODE_ENV === 'development', | 87 | .when(process.env.NODE_ENV === 'development', |
| 86 | config => config.devtool('cheap-source-map') | 88 | config => config.devtool('cheap-source-map') |
| 87 | ) | 89 | ) |
| 88 | 90 | ||
| 89 | config | 91 | config |
| 90 | .when(process.env.NODE_ENV !== 'development', | 92 | .when(process.env.NODE_ENV !== 'development', |
| 91 | config => { | 93 | config => { |
| 92 | config | 94 | config |
| 93 | .plugin('ScriptExtHtmlWebpackPlugin') | 95 | .plugin('ScriptExtHtmlWebpackPlugin') |
| 94 | .after('html') | 96 | .after('html') |
| 95 | .use('script-ext-html-webpack-plugin', [{ | 97 | .use('script-ext-html-webpack-plugin', [{ |
| 96 | // `runtime` must same as runtimeChunk name. default is `runtime` | 98 | // `runtime` must same as runtimeChunk name. default is `runtime` |
| 97 | inline: /runtime\..*\.js$/ | 99 | inline: /runtime\..*\.js$/ |
| 98 | }]) | 100 | }]) |
| 99 | .end() | 101 | .end() |
| 100 | config | 102 | config |
| 101 | .optimization.splitChunks({ | 103 | .optimization.splitChunks({ |
| 102 | chunks: 'all', | 104 | chunks: 'all', |
| 103 | cacheGroups: { | 105 | cacheGroups: { |
| 104 | libs: { | 106 | libs: { |
| 105 | name: 'chunk-libs', | 107 | name: 'chunk-libs', |
| 106 | test: /[\\/]node_modules[\\/]/, | 108 | test: /[\\/]node_modules[\\/]/, |
| 107 | priority: 10, | 109 | priority: 10, |
| 108 | chunks: 'initial' // only package third parties that are initially dependent | 110 | chunks: 'initial' // only package third parties that are initially dependent |
| 109 | }, | 111 | }, |
| 110 | elementUI: { | 112 | elementUI: { |
| 111 | name: 'chunk-elementUI', // split elementUI into a single package | 113 | name: 'chunk-elementUI', // split elementUI into a single package |
| 112 | priority: 20, // the weight needs to be larger than libs and app or it will be packaged into libs or app | 114 | priority: 20, // the weight needs to be larger than libs and app or it will be packaged into libs or app |
| 113 | test: /[\\/]node_modules[\\/]_?element-ui(.*)/ // in order to adapt to cnpm | 115 | test: /[\\/]node_modules[\\/]_?element-ui(.*)/ // in order to adapt to cnpm |
| 114 | }, | 116 | }, |
| 115 | commons: { | 117 | commons: { |
| 116 | name: 'chunk-commons', | 118 | name: 'chunk-commons', |
| 117 | test: resolve('src/components'), // can customize your rules | 119 | test: resolve('src/components'), // can customize your rules |
| 118 | minChunks: 3, // minimum common number | 120 | minChunks: 3, // minimum common number |
| 119 | priority: 5, | 121 | priority: 5, |
| 120 | reuseExistingChunk: true | 122 | reuseExistingChunk: true |
| 121 | } | 123 | } |
| 122 | } | 124 | } |
| 123 | }) | 125 | }) |
| 124 | config.optimization.runtimeChunk('single') | 126 | config.optimization.runtimeChunk('single') |
| 125 | } | 127 | } |
| 126 | ) | 128 | ) |
| 127 | } | 129 | } |
| 128 | } | 130 | } |
| 129 | 131 |