AnhuiDailyQuiz/vue.config.js

const path = require('path')
const resolve = dir => path.join(__dirname, '.', dir)
module.exports = {
  /**
   * baseUrl等价于webpack打包的资源引用的publishPath和全局的BASER_URL变量
   */
  publicPath: './',

  // 打包的静态资源相对outputDir的路径，outputDir使用默认值'dist'
  assetsDir: 'static',
  /**
   * 开启保存自动代码检测，设置true可配合derServer overlay浏览器上显示错误，强制进行代码检测
   * 也可设置error可直接阻断打包
   */
  lintOnSave: 'error',
  // 默认不使用template渲染模式，明确只使用运行时打包项目
  runtimeCompiler: false,
  /**
   * 开发环境还是使用默认的 inline-source-map
   */
  productionSourceMap: false,
  /**
   * 给插入index.html的link、script标签添加crossorigin属性
   */
  // crossorigin: 'anonymous',
  
  css: {
    loaderOptions: {
      less: {
        lessOptions: {
          modifyVars: {
            hack: `true; @import "@/styles/vant-ui.less";`
          }
        }
      }
    }
  },
  chainWebpack: config => {
    // config
    // .plugin('webpack-bundle-analyzer')
    // .use(require('webpack-bundle-analyzer').BundleAnalyzerPlugin)
    // 提取 manifest(runtime)
    config.optimization
      .runtimeChunk({
        name: 'manifest'
      })
    // 代码分包调整
    config.optimization
      .splitChunks({
        chunks: 'all',
        cacheGroups: {
          libs: {
            name: 'chunk-libs',
            test: /[\\/]node_modules[\\/]/,
            chunks: 'initial' // 只打包初始时依赖的第三方
          },
          commons: {
            name: 'chunk-commons',
            test: resolve('src'), // 可自定义拓展你的规则
            chunks: 'initial',
            reuseExistingChunk: true
          }
        }
      })
    // config.module
    //   .rule('scss')
    //   .loader('sass-resources-loader')
    //   .options({
    //     resources: path.resolve('src/styles/global.scss')
    //   })
    //   .end()
    config.module
      .rule('svg')
      .exclude.add(resolve('src/icons'))
      .end()
    config.module
      .rule('icons')
      .test(/\.svg$/)
      .include.add(resolve('src/icons'))
      .end()
      .use('svg-sprite-loader')
      .loader('svg-sprite-loader')
      .options({
        symbolId: 'icon-[name]'
      })
      .end()

    config.resolve.alias
      .set('src', resolve('src'))
      .set('@', resolve('src'))
      .set('@api', resolve('src/api'))
      .set('@components', resolve("src/components"))
      .set('@assets', resolve('src/assets'))
      .set('@store', resolve('src/store')) 
      .set('@utils', resolve('src/utils'))
      .set('@views', resolve('src/views'))
      // .set('@', resolve('public'))
      
    // 给异步加载的静态资源标签添加crossorigin属性
    config.output.crossOriginLoading('anonymous')
  },
}