vue.config.js 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129
  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 isProd = process.env.NODE_ENV === 'production'
  8. const assetsCDN = {
  9. // webpack build externals
  10. externals: {
  11. vue: 'Vue',
  12. 'vue-router': 'VueRouter',
  13. vuex: 'Vuex',
  14. axios: 'axios'
  15. },
  16. css: [],
  17. // https://unpkg.com/browse/vue@2.6.10/
  18. js: [
  19. // '//cdn.jsdelivr.net/npm/vue@2.6.10/dist/vue.min.js',
  20. // '//cdn.jsdelivr.net/npm/vue-router@3.1.3/dist/vue-router.min.js',
  21. // '//cdn.jsdelivr.net/npm/vuex@3.1.1/dist/vuex.min.js',
  22. // '//cdn.jsdelivr.net/npm/axios@0.19.0/dist/axios.min.js'
  23. '//lib.baomitu.com/vue/2.6.10/vue.min.js',
  24. '//lib.baomitu.com/vue-router/3.1.3/vue-router.min.js',
  25. '//lib.baomitu.com/vuex/3.1.1/vuex.min.js',
  26. '//lib.baomitu.com/axios/0.19.0/axios.min.js'
  27. ]
  28. }
  29. // vue.config.js
  30. const vueConfig = {
  31. // 部署应用包时的基本 URL
  32. publicPath: process.env.NODE_ENV === 'production' ? './' : '/',
  33. configureWebpack: {
  34. // webpack plugins
  35. plugins: [
  36. // Ignore all locale files of moment.js
  37. new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/)
  38. ],
  39. // if prod, add externals
  40. externals: isProd ? assetsCDN.externals : {}
  41. },
  42. chainWebpack: (config) => {
  43. config.resolve.alias
  44. .set('@$', resolve('src'))
  45. const svgRule = config.module.rule('svg')
  46. svgRule.uses.clear()
  47. svgRule
  48. .oneOf('inline')
  49. .resourceQuery(/inline/)
  50. .use('vue-svg-icon-loader')
  51. .loader('vue-svg-icon-loader')
  52. .end()
  53. .end()
  54. .oneOf('external')
  55. .use('file-loader')
  56. .loader('file-loader')
  57. .options({
  58. name: 'assets/[name].[hash:8].[ext]'
  59. })
  60. // if prod is on
  61. // assets require on cdn
  62. if (isProd) {
  63. config.plugin('html').tap(args => {
  64. args[0].cdn = assetsCDN
  65. return args
  66. })
  67. }
  68. },
  69. css: {
  70. // 定位css文件
  71. sourceMap: true,
  72. loaderOptions: {
  73. less: {
  74. modifyVars: {
  75. // less vars,customize ant design theme
  76. // 'primary-color': '#F5222D',
  77. // 'link-color': '#F5222D',
  78. 'border-radius-base': '2px'
  79. },
  80. // DO NOT REMOVE THIS LINE
  81. javascriptEnabled: true
  82. }
  83. }
  84. },
  85. /**
  86. * 开发环境proxy代理 [用于跨域]
  87. */
  88. devServer: {
  89. // development server port 8000
  90. port: 8000
  91. // If you want to turn on the proxy, please remove the mockjs /src/main.js L11
  92. // proxy: {
  93. // '/api': {
  94. // target: 'https://www.abc.com/index.php/admin',
  95. // ws: false,
  96. // changeOrigin: true,
  97. // pathRewrite: {
  98. // '/api': ''
  99. // }
  100. // }
  101. // }
  102. },
  103. // disable source map in production
  104. productionSourceMap: false,
  105. lintOnSave: undefined,
  106. // babel-loader no-ignore node_modules/*
  107. transpileDependencies: []
  108. }
  109. // preview.pro.loacg.com only do not use in your production;
  110. if (process.env.VUE_APP_PREVIEW === 'true') {
  111. console.log('VUE_APP_PREVIEW', true)
  112. // add `ThemeColorReplacer` plugin to webpack plugins
  113. vueConfig.configureWebpack.plugins.push(createThemeColorReplacerPlugin())
  114. }
  115. module.exports = vueConfig