vue.config.js 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132
  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({
  38. resourceRegExp: /^\.\/locale$/,
  39. contextRegExp: /moment$/
  40. })
  41. ],
  42. // if prod, add externals
  43. externals: isProd ? assetsCDN.externals : {}
  44. },
  45. chainWebpack: (config) => {
  46. config.resolve.alias
  47. .set('@$', resolve('src'))
  48. const svgRule = config.module.rule('svg')
  49. svgRule.uses.clear()
  50. svgRule
  51. .oneOf('inline')
  52. .resourceQuery(/inline/)
  53. .use('vue-svg-icon-loader')
  54. .loader('vue-svg-icon-loader')
  55. .end()
  56. .end()
  57. .oneOf('external')
  58. .use('file-loader')
  59. .loader('file-loader')
  60. .options({
  61. name: 'assets/[name].[hash:8].[ext]'
  62. })
  63. // if prod is on
  64. // assets require on cdn
  65. if (isProd) {
  66. config.plugin('html').tap(args => {
  67. args[0].cdn = assetsCDN
  68. return args
  69. })
  70. }
  71. },
  72. css: {
  73. // 定位css文件
  74. sourceMap: true,
  75. loaderOptions: {
  76. less: {
  77. modifyVars: {
  78. // less vars,customize ant design theme
  79. // 'primary-color': '#F5222D',
  80. // 'link-color': '#F5222D',
  81. 'border-radius-base': '2px'
  82. },
  83. // DO NOT REMOVE THIS LINE
  84. javascriptEnabled: true
  85. }
  86. }
  87. },
  88. /**
  89. * 开发环境proxy代理 [用于跨域]
  90. */
  91. devServer: {
  92. // development server port 8000
  93. port: 8000
  94. // If you want to turn on the proxy, please remove the mockjs /src/main.js L11
  95. // proxy: {
  96. // '/api': {
  97. // target: 'https://www.abc.com/index.php/admin',
  98. // ws: false,
  99. // changeOrigin: true,
  100. // pathRewrite: {
  101. // '/api': ''
  102. // }
  103. // }
  104. // }
  105. },
  106. // disable source map in production
  107. productionSourceMap: false,
  108. lintOnSave: undefined,
  109. // babel-loader no-ignore node_modules/*
  110. transpileDependencies: []
  111. }
  112. // preview.pro.loacg.com only do not use in your production;
  113. if (process.env.VUE_APP_PREVIEW === 'true') {
  114. console.log('VUE_APP_PREVIEW', true)
  115. // add `ThemeColorReplacer` plugin to webpack plugins
  116. vueConfig.configureWebpack.plugins.push(createThemeColorReplacerPlugin())
  117. }
  118. module.exports = vueConfig