vue.config.js 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105
  1. const path = require('path')
  2. const webpack = require('webpack')
  3. const createThemeColorReplacerPlugin = require('./config/plugin.config')
  4. function resolve (dir) {
  5. return path.join(__dirname, dir)
  6. }
  7. const assetsCDN = {
  8. css: [],
  9. // https://unpkg.com/browse/vue@2.6.10/
  10. js: [
  11. '//unpkg.com/vue@2.6.10/dist/vue.min.js',
  12. '//unpkg.com/vue-router@3.0.6/dist/vue-router.min.js',
  13. '//unpkg.com/vuex@3.1.1/dist/vuex.min.js',
  14. '//unpkg.com/axios@0.19.0/dist/axios.min.js'
  15. ]
  16. }
  17. // vue.config.js
  18. const vueConfig = {
  19. configureWebpack: {
  20. // webpack plugins
  21. plugins: [
  22. // Ignore all locale files of moment.js
  23. new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/)
  24. ],
  25. // webpack build externals
  26. externals: {
  27. vue: 'Vue',
  28. 'vue-router': 'VueRouter',
  29. vuex: 'Vuex',
  30. axios: 'axios'
  31. }
  32. },
  33. chainWebpack: (config) => {
  34. config.resolve.alias
  35. .set('@$', resolve('src'))
  36. const svgRule = config.module.rule('svg')
  37. svgRule.uses.clear()
  38. svgRule
  39. .oneOf('inline')
  40. .resourceQuery(/inline/)
  41. .use('vue-svg-icon-loader')
  42. .loader('vue-svg-icon-loader')
  43. .end()
  44. .end()
  45. .oneOf('external')
  46. .use('file-loader')
  47. .loader('file-loader')
  48. .options({
  49. name: 'assets/[name].[hash:8].[ext]'
  50. })
  51. // assets require on cdn
  52. config.plugin('html').tap(args => {
  53. args[0].cdn = assetsCDN
  54. return args
  55. })
  56. },
  57. css: {
  58. loaderOptions: {
  59. less: {
  60. modifyVars: {
  61. // less vars,customize ant design theme
  62. // 'primary-color': '#F5222D',
  63. // 'link-color': '#F5222D',
  64. // 'border-radius-base': '4px'
  65. },
  66. javascriptEnabled: true
  67. }
  68. }
  69. },
  70. devServer: {
  71. // development server port 8000
  72. port: 8000
  73. // If you want to turn on the proxy, please remove the mockjs /src/main.jsL11
  74. // proxy: {
  75. // '/api': {
  76. // target: 'https://mock.ihx.me/mock/5baf3052f7da7e07e04a5116/antd-pro',
  77. // ws: false,
  78. // changeOrigin: true
  79. // }
  80. // }
  81. },
  82. // disable source map in production
  83. productionSourceMap: false,
  84. lintOnSave: undefined,
  85. // babel-loader no-ignore node_modules/*
  86. transpileDependencies: []
  87. }
  88. // preview.pro.loacg.com only do not use in your production;
  89. if (process.env.NODE_ENV !== 'production' || process.env.VUE_APP_PREVIEW === 'true') {
  90. // add `ThemeColorReplacer` plugin to webpack plugins
  91. vueConfig.configureWebpack.plugins.push(createThemeColorReplacerPlugin())
  92. }
  93. module.exports = vueConfig