yxkadmin-el/vue.config.js

'use strict'

//基本项目配置
const path = require('path')
const defaultSettings = require('./src/settings.js')

//项目路径
function resolve(dir) {
  return path.join(__dirname, dir)
}

// 网址标题
const name = defaultSettings.title
// 端口配置
const port = 8013

//代理配置
module.exports = {

  // hash 模式下可使用
  // publicPath: process.env.NODE_ENV === 'development' ? '/' : './',
  //部署应用包时的基本 URL
  publicPath: '/',
  //当运行 vue-cli-service build 时生成的生产环境构建文件的目录
  outputDir: 'dist',
  //放置生成的静态资源 (js、css、img、fonts) 的 (相对于 outputDir 的) 目录
  assetsDir: 'static',
  //是否在开发环境下通过 eslint-loader 在每次保存时 lint 代码
  lintOnSave: process.env.NODE_ENV === 'development',
  //不需要生产环境构建source map，方便输出的错误信息
  productionSourceMap: false,

  devServer: {
    //配置服务器端口设置
    port: port,
    //告诉 dev-server 在服务器已经启动后打开浏览器。设置其为 true 以打开你的默认浏览器。
    open: true,
    //当出现编译错误或警告时，在浏览器中显示全屏覆盖。
    overlay: {
      warnings: false,
      errors: true
    },
    //开发代理服务设置
    proxy: {
      '/api': {
        //代理目标路径
        target: process.env.VUE_APP_BASE_API,
        //保留主机头的来源
        changeOrigin: true,
        //路径规则
        pathRewrite: {
          '^/api': 'api'
        }
      },
      '/auth': {
        target: process.env.VUE_APP_BASE_API,
        changeOrigin: true,
        pathRewrite: {
          '^/auth': 'auth'
        }
      }
    }
  },
  //调试VUE
  configureWebpack: {
    devtool: 'source-map'
  }
//   configureWebpack: {
//     // 覆盖webpack默认配置的都在这里
//     name: name,
//     resolve: {
//       alias: {
//         '@': resolve('src'),
//         '@crud': resolve('src/components/Crud')
//       },

//       chainWebpack(config) {
//         config.plugins.delete('preload') 
//         config.plugins.delete('prefetch')

//         // set svg-sprite-loader
//         config.module
//           .rule('svg')
//           .exclude.add(resolve('src/assets/icons'))
//           .end()
//         config.module
//           .rule('icons')
//           .test(/\.svg$/)
//           .include.add(resolve('src/assets/icons'))
//           .end()
//           .use('svg-sprite-loader')
//           .loader('svg-sprite-loader')
//           .options({
//             symbolId: 'icon-[name]'
//           })
//           .end()

//         // set preserveWhitespace
//         config.module
//           .rule('vue')
//           .use('vue-loader')
//           .loader('vue-loader')
//           .tap(options => {
//             options.compilerOptions.preserveWhitespace = true
//             return options
//           })
//           .end()

//         config

//           .when(process.env.NODE_ENV === 'development',
//             config => config.devtool('cheap-source-map')
//           )

//         config
//           .when(process.env.NODE_ENV !== 'development',
//             config => {
//               config
//                 .plugin('ScriptExtHtmlWebpackPlugin')
//                 .after('html')
//                 .use('script-ext-html-webpack-plugin', [{

//                   inline: /runtime\..*\.js$/
//                 }])
//                 .end()
//               config
//                 .optimization.splitChunks({
//                   chunks: 'all',
//                   cacheGroups: {
//                     libs: {
//                       name: 'chunk-libs',
//                       test: /[\\/]node_modules[\\/]/,
//                       priority: 10,
//                       chunks: 'initial'
//                     },
//                     elementUI: {
//                       name: 'chunk-elementUI',
//                       priority: 20,
//                       test: /[\\/]node_modules[\\/]_?element-ui(.*)/
//                     },
//                     commons: {
//                       name: 'chunk-commons',
//                       test: resolve('src/components'),
//                       minChunks: 3,
//                       priority: 5,
//                       reuseExistingChunk: true
//                     }
//                   }
//                 })
//               config.optimization.runtimeChunk('single')
//             }
//           )
//       },
//       transpileDependencies: [
//         'vue-echarts',
//         'resize-detector'
//       ]
//     }
//   }
}