vue.config.js 8.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256
  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 || 'EICP' // 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 || 9528 // 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. // publicPath: '/',
  28. // outputDir: 'dist',
  29. // assetsDir: 'EicpWeb/static',
  30. // lintOnSave: process.env.NODE_ENV === 'development',
  31. // productionSourceMap: false,
  32. // devServer: {
  33. // // port: port,
  34. // // open: true,
  35. // // overlay: {
  36. // // warnings: false,
  37. // // errors: true
  38. // // },
  39. // // before: require('./mock/mock-server.js'),
  40. // // proxy: {
  41. // // '/api': {
  42. // // 'target': 'http://localhost:7888/api/RpcInvoke',
  43. // // // 'secure': false, // false为http访问,true为https访问
  44. // // 'changeOrigin': true, // 跨域访问设置,true代表跨域
  45. // // // 'pathRewrite': { // 路径改写规则
  46. // // // '^/api': '' // 以/proxy/为开头的改写为''
  47. // // // }
  48. // // }
  49. // // }
  50. // },
  51. // configureWebpack: {
  52. // // provide the app's title in webpack's name field, so that
  53. // // it can be accessed in index.html to inject the correct title.
  54. // // devtool: 'source-map',
  55. // name: name,
  56. // resolve: {
  57. // alias: {
  58. // '@': resolve('src')
  59. // }
  60. // }
  61. // },
  62. // chainWebpack(config) {
  63. // // it can improve the speed of the first screen, it is recommended to turn on preload
  64. // config.plugin('preload').tap(() => [{
  65. // rel: 'preload',
  66. // // to ignore runtime.js
  67. // // https://github.com/vuejs/vue-cli/blob/dev/packages/@vue/cli-service/lib/config/app.js#L171
  68. // fileBlacklist: [/\.map$/, /hot-update\.js$/, /runtime\..*\.js$/],
  69. // include: 'initial'
  70. // }])
  71. //
  72. // // when there are many pages, it will cause too many meaningless requests
  73. // config.plugins.delete('prefetch')
  74. //
  75. // // set svg-sprite-loader
  76. // config.module
  77. // .rule('svg')
  78. // .exclude.add(resolve('src/icons'))
  79. // .end()
  80. // config.module
  81. // .rule('icons')
  82. // .test(/\.svg$/)
  83. // .include.add(resolve('src/icons'))
  84. // .end()
  85. // .use('svg-sprite-loader')
  86. // .loader('svg-sprite-loader')
  87. // .options({
  88. // symbolId: 'icon-[name]'
  89. // })
  90. // .end()
  91. //
  92. // config
  93. // .when(process.env.NODE_ENV !== 'development',
  94. // config => {
  95. // config
  96. // .plugin('ScriptExtHtmlWebpackPlugin')
  97. // .after('html')
  98. // .use('script-ext-html-webpack-plugin', [{
  99. // // `runtime` must same as runtimeChunk name. default is `runtime`
  100. // inline: /runtime\..*\.js$/
  101. // }])
  102. // .end()
  103. // config
  104. // .optimization.splitChunks({
  105. // chunks: 'all',
  106. // cacheGroups: {
  107. // libs: {
  108. // name: 'chunk-libs',
  109. // test: /[\\/]node_modules[\\/]/,
  110. // priority: 10,
  111. // chunks: 'initial' // only package third parties that are initially dependent
  112. // },
  113. // elementUI: {
  114. // name: 'chunk-elementUI', // split elementUI into a single package
  115. // priority: 20, // the weight needs to be larger than libs and app or it will be packaged into libs or app
  116. // test: /[\\/]node_modules[\\/]_?element-ui(.*)/ // in order to adapt to cnpm
  117. // },
  118. // commons: {
  119. // name: 'chunk-commons',
  120. // test: resolve('src/components'), // can customize your rules
  121. // minChunks: 3, // minimum common number
  122. // priority: 5,
  123. // reuseExistingChunk: true
  124. // }
  125. // }
  126. // })
  127. // // https:// webpack.js.org/configuration/optimization/#optimizationruntimechunk
  128. // config.optimization.runtimeChunk('single')
  129. // }
  130. // )
  131. // }
  132. // }
  133. 'use strict'
  134. const path = require('path')
  135. const defaultSettings = require('./src/settings.js')
  136. function resolve(dir) {
  137. return path.join(__dirname, dir)
  138. }
  139. const name = defaultSettings.title || 'vue Admin Template' // page title
  140. // If your port is set to 80,
  141. // use administrator privileges to execute the command line.
  142. // For example, Mac: sudo npm run
  143. // You can change the port by the following methods:
  144. // port = 9528 npm run dev OR npm run dev --port = 9528
  145. const port = process.env.port || process.env.npm_config_port || 9528 // dev port
  146. // All configuration item explanations can be find in https://cli.vuejs.org/config/
  147. module.exports = {
  148. /**
  149. * You will need to set publicPath if you plan to deploy your site under a sub path,
  150. * for example GitHub Pages. If you plan to deploy your site to https://foo.github.io/bar/,
  151. * then publicPath should be set to "/bar/".
  152. * In most cases please use '/' !!!
  153. * Detail: https://cli.vuejs.org/config/#publicpath
  154. */
  155. publicPath: './',
  156. outputDir: 'dist',
  157. assetsDir: 'static',
  158. lintOnSave: process.env.NODE_ENV === 'development',
  159. productionSourceMap: false,
  160. devServer: {
  161. port
  162. // open: true,
  163. // overlay: {
  164. // warnings: false,
  165. // errors: true
  166. // }
  167. // before: require('./mock/mock-server.js')
  168. },
  169. configureWebpack: {
  170. // provide the app's title in webpack's name field, so that
  171. // it can be accessed in index.html to inject the correct title.
  172. name: name,
  173. resolve: {
  174. alias: {
  175. '@': resolve('src')
  176. }
  177. }
  178. },
  179. chainWebpack(config) {
  180. // it can improve the speed of the first screen, it is recommended to turn on preload
  181. config.plugin('preload').tap(() => [
  182. {
  183. rel: 'preload',
  184. // to ignore runtime.js
  185. // https://github.com/vuejs/vue-cli/blob/dev/packages/@vue/cli-service/lib/config/app.js#L171
  186. fileBlacklist: [/\.map$/, /hot-update\.js$/, /runtime\..*\.js$/],
  187. include: 'initial'
  188. }
  189. ])
  190. // when there are many pages, it will cause too many meaningless requests
  191. config.plugins.delete('prefetch')
  192. // set svg-sprite-loader
  193. config.module
  194. .rule('svg')
  195. .exclude.add(resolve('src/icons'))
  196. .end()
  197. config.module
  198. .rule('icons')
  199. .test(/\.svg$/)
  200. .include.add(resolve('src/icons'))
  201. .end()
  202. .use('svg-sprite-loader')
  203. .loader('svg-sprite-loader')
  204. .options({
  205. symbolId: 'icon-[name]'
  206. })
  207. .end()
  208. config
  209. .when(process.env.NODE_ENV !== 'development',
  210. config => {
  211. config
  212. .plugin('ScriptExtHtmlWebpackPlugin')
  213. .after('html')
  214. .use('script-ext-html-webpack-plugin', [{
  215. // `runtime` must same as runtimeChunk name. default is `runtime`
  216. inline: /runtime\..*\.js$/
  217. }])
  218. .end()
  219. config
  220. .optimization.splitChunks({
  221. chunks: 'all',
  222. cacheGroups: {
  223. libs: {
  224. name: 'chunk-libs',
  225. test: /[\\/]node_modules[\\/]/,
  226. priority: 10,
  227. chunks: 'initial' // only package third parties that are initially dependent
  228. },
  229. elementUI: {
  230. name: 'chunk-elementUI', // split elementUI into a single package
  231. priority: 20, // the weight needs to be larger than libs and app or it will be packaged into libs or app
  232. test: /[\\/]node_modules[\\/]_?element-ui(.*)/ // in order to adapt to cnpm
  233. },
  234. commons: {
  235. name: 'chunk-commons',
  236. test: resolve('src/components'), // can customize your rules
  237. minChunks: 3, // minimum common number
  238. priority: 5,
  239. reuseExistingChunk: true
  240. }
  241. }
  242. })
  243. // https:// webpack.js.org/configuration/optimization/#optimizationruntimechunk
  244. config.optimization.runtimeChunk('single')
  245. }
  246. )
  247. }
  248. }