vue.config.js 3.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146
  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. /**
  8. * check production or preview(pro.loacg.com only)
  9. * @returns {boolean}
  10. */
  11. function isProd () {
  12. return process.env.NODE_ENV === 'production'
  13. }
  14. // 项目部署基础
  15. // 默认情况下,我们假设你的应用将被部署在域的根目录下,
  16. // 例如:https://www.my-app.com/
  17. // 默认:'/'
  18. // 如果您的应用程序部署在子路径中,则需要在这指定子路径
  19. // 例如:https://www.foobar.com/my-app/
  20. // 需要将它改为'/my-app/'
  21. const BASE_URL = isProd ? '/' : '/'
  22. const assetsCDN = {
  23. css: [],
  24. // https://unpkg.com/browse/vue@2.6.10/
  25. js: [
  26. '//vuepkg.oss-cn-beijing.aliyuncs.com/vue.min.js',
  27. '//vuepkg.oss-cn-beijing.aliyuncs.com/vue-router.min.js',
  28. '//vuepkg.oss-cn-beijing.aliyuncs.com/vuex.min.js',
  29. '//vuepkg.oss-cn-beijing.aliyuncs.com/axios.min.js'
  30. ]
  31. }
  32. // webpack build externals
  33. const prodExternals = {
  34. vue: 'Vue',
  35. 'vue-router': 'VueRouter',
  36. vuex: 'Vuex',
  37. axios: 'axios'
  38. }
  39. // vue.config.js
  40. const vueConfig = {
  41. runtimeCompiler: true, // 动态编译组件
  42. publicPath: BASE_URL,
  43. configureWebpack: {
  44. // webpack plugins
  45. plugins: [
  46. // Ignore all locale files of moment.js
  47. new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/)
  48. ],
  49. // if prod is on, add externals
  50. externals: isProd() ? prodExternals : {}
  51. },
  52. chainWebpack: (config) => {
  53. config.resolve.alias
  54. .set('@$', resolve('src'))
  55. const svgRule = config.module.rule('svg')
  56. svgRule.uses.clear()
  57. svgRule
  58. .oneOf('inline')
  59. .resourceQuery(/inline/)
  60. .use('vue-svg-icon-loader')
  61. .loader('vue-svg-icon-loader')
  62. .end()
  63. .end()
  64. .oneOf('external')
  65. .use('file-loader')
  66. .loader('file-loader')
  67. .options({
  68. name: 'assets/[name].[hash:8].[ext]'
  69. })
  70. // if prod is on
  71. // assets require on cdn
  72. if (isProd()) {
  73. config.plugin('html').tap(args => {
  74. args[0].cdn = assetsCDN
  75. return args
  76. })
  77. }
  78. // 分析打包大小
  79. if (process.env.npm_config_report) {
  80. config.plugin('webpack-bundle-analyzer')
  81. .use(require('webpack-bundle-analyzer').BundleAnalyzerPlugin)
  82. .end();
  83. }
  84. },
  85. css: {
  86. sourceMap: false,
  87. loaderOptions: {
  88. less: {
  89. modifyVars: {
  90. // less vars锛宑ustomize ant design theme
  91. 'primary-color': process.env.VUE_APP_THEME_COLOR,
  92. 'link-color': process.env.VUE_APP_THEME_COLOR
  93. // 'border-radius-base': '4px'
  94. },
  95. // do not remove this line
  96. javascriptEnabled: true
  97. }
  98. }
  99. },
  100. devServer: {
  101. // development server port 8000
  102. port: 8000,
  103. disableHostCheck: true,
  104. // If you want to turn on the proxy, please remove the mockjs /src/main.jsL11
  105. proxy: {
  106. '/api': {
  107. target: 'http://192.168.16.105:8503/qpls-md',
  108. // target: 'http://p.iscm.360arrow.com/qpls-md',
  109. // ws: false,
  110. ws: true,
  111. changeOrigin: true,
  112. pathRewrite: {
  113. '^/api': ''
  114. }
  115. }
  116. }
  117. },
  118. // disable source map in production
  119. productionSourceMap: false,
  120. assetsDir: 'static',
  121. lintOnSave: undefined,
  122. // babel-loader no-ignore node_modules/*
  123. transpileDependencies: []
  124. }
  125. // preview.pro.loacg.com only do not use in your production;
  126. if (process.env.VUE_APP_PREVIEW === 'true') {
  127. console.log('VUE_APP_PREVIEW', true)
  128. // add `ThemeColorReplacer` plugin to webpack plugins
  129. vueConfig.configureWebpack.plugins.push(createThemeColorReplacerPlugin())
  130. }
  131. module.exports = vueConfig