vue.config.js 5.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169
  1. 'use strict'
  2. const path = require('path')
  3. const defaultSettings = require('./src/settings.js')
  4. function resolve(dir) {
  5. return path.join(__dirname, dir)
  6. }
  7. const name = defaultSettings.title || 'vue Element Admin' // page title
  8. // If your port is set to 80,
  9. // use administrator privileges to execute the command line.
  10. // For example, Mac: sudo npm run
  11. // You can change the port by the following method:
  12. // port = 9527 npm run dev OR npm run dev --port = 9527
  13. const port = process.env.port || process.env.npm_config_port || 9527 // dev port
  14. // All configuration item explanations can be find in https://cli.vuejs.org/config/
  15. module.exports = {
  16. /**
  17. * You will need to set publicPath if you plan to deploy your site under a sub path,
  18. * for example GitHub Pages. If you plan to deploy your site to https://foo.github.io/bar/,
  19. * then publicPath should be set to "/bar/".
  20. * In most cases please use '/' !!!
  21. * Detail: https://cli.vuejs.org/config/#publicpath
  22. */
  23. publicPath: '/',
  24. outputDir: 'dist',
  25. assetsDir: 'static',
  26. // lintOnSave: process.env.NODE_ENV === 'development',
  27. // 取消 ESLint 校验
  28. lintOnSave:false,
  29. productionSourceMap: false,
  30. devServer: {
  31. proxy: { //配置跨域
  32. '/api': {
  33. target: 'http://10.10.1.25:9099', //这里后台的地址模拟的;应该填写你们真实的后台接口
  34. changOrigin: true, //允许跨域
  35. pathRewrite: {
  36. /* 重写路径,当我们在浏览器中看到请求的地址为:http://localhost:8080/api/core/getData/userInfo 时
  37. 实际上访问的地址是:http://121.121.67.254:8185/core/getData/userInfo,因为重写了 /api
  38. */
  39. '^/api': ''
  40. }
  41. },
  42. '/webs': {
  43. target: 'http://139.159.183.224:19999', //这里后台的地址模拟的;应该填写你们真实的后台接口
  44. changOrigin: true, //允许跨域
  45. pathRewrite: {
  46. /* 重写路径,当我们在浏览器中看到请求的地址为:http://localhost:8080/api/core/getData/userInfo 时
  47. 实际上访问的地址是:http://121.121.67.254:8185/core/getData/userInfo,因为重写了 /api
  48. */
  49. '^/webs': ''
  50. }
  51. },
  52. },
  53. port: port,
  54. open: true,
  55. overlay: {
  56. warnings: false,
  57. errors: true
  58. },
  59. //before: require('./mock/mock-server.js') //注释,不然会先走mock,然后再走本地服务不,被mock拦截了
  60. },
  61. configureWebpack: {
  62. // provide the app's title in webpack's name field, so that
  63. // it can be accessed in index.html to inject the correct title.
  64. name: name,
  65. resolve: {
  66. alias: {
  67. '@': resolve('src')
  68. }
  69. }
  70. },
  71. chainWebpack(config) {
  72. // it can improve the speed of the first screen, it is recommended to turn on preload
  73. // it can improve the speed of the first screen, it is recommended to turn on preload
  74. config.plugin('preload').tap(() => [
  75. {
  76. rel: 'preload',
  77. // to ignore runtime.js
  78. // https://github.com/vuejs/vue-cli/blob/dev/packages/@vue/cli-service/lib/config/app.js#L171
  79. fileBlacklist: [/\.map$/, /hot-update\.js$/, /runtime\..*\.js$/],
  80. include: 'initial'
  81. }
  82. ])
  83. // when there are many pages, it will cause too many meaningless requests
  84. config.plugins.delete('prefetch')
  85. // set svg-sprite-loader
  86. config.module
  87. .rule('svg')
  88. .exclude.add(resolve('src/icons'))
  89. .end()
  90. config.module
  91. .rule('icons')
  92. .test(/\.svg$/)
  93. .include.add(resolve('src/icons'))
  94. .end()
  95. .use('svg-sprite-loader')
  96. .loader('svg-sprite-loader')
  97. .options({
  98. symbolId: 'icon-[name]'
  99. })
  100. .end()
  101. config
  102. .when(process.env.NODE_ENV !== 'development',
  103. config => {
  104. config
  105. .plugin('ScriptExtHtmlWebpackPlugin')
  106. .after('html')
  107. .use('script-ext-html-webpack-plugin', [{
  108. // `runtime` must same as runtimeChunk name. default is `runtime`
  109. inline: /runtime\..*\.js$/
  110. }])
  111. .end()
  112. config
  113. .optimization.splitChunks({
  114. chunks: 'all',
  115. cacheGroups: {
  116. libs: {
  117. name: 'chunk-libs',
  118. test: /[\\/]node_modules[\\/]/,
  119. priority: 10,
  120. chunks: 'initial' // only package third parties that are initially dependent
  121. },
  122. elementUI: {
  123. name: 'chunk-elementUI', // split elementUI into a single package
  124. priority: 20, // the weight needs to be larger than libs and app or it will be packaged into libs or app
  125. test: /[\\/]node_modules[\\/]_?element-ui(.*)/ // in order to adapt to cnpm
  126. },
  127. commons: {
  128. name: 'chunk-commons',
  129. test: resolve('src/components'), // can customize your rules
  130. minChunks: 3, // minimum common number
  131. priority: 5,
  132. reuseExistingChunk: true
  133. }
  134. }
  135. })
  136. // https:// webpack.js.org/configuration/optimization/#optimizationruntimechunk
  137. config.optimization.runtimeChunk('single')
  138. }
  139. )
  140. }
  141. }