// 配置文件

// 导入webpack插件，不需要安装，vue-cli里面已经集成好了
const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer')

const isProd = process.env.NODE_ENV === 'production'

let plugins = []
let externals = {}
let cdn = { js: [], css: [] }
if (isProd) {
  plugins = [
    new BundleAnalyzerPlugin({
      analyzerPort: 9999 // 端口号
    })
  ]
  externals = {
    vue: 'Vue',
    'vue-router': 'VueRouter',
    axios: 'axios',
    lodash: '_',
    vant:'vant',
    vuex:'Vuex',
    cropperjs:'Cropper'
  }
  cdn = {
    css: [
      'https://cdn.jsdelivr.net/npm/vant@2.12/lib/index.css',
      'https://cdnjs.cloudflare.com/ajax/libs/cropperjs/1.5.11/cropper.css'
    ],
    js: [
      'https://cdn.staticfile.org/vue/2.5.22/vue.min.js',
      'https://cdn.staticfile.org/vue-router/3.0.1/vue-router.min.js',
      'https://unpkg.com/vuex@3.6.2/dist/vuex.js',
      'https://cdnjs.cloudflare.com/ajax/libs/cropperjs/1.5.11/cropper.js',
      'https://cdn.jsdelivr.net/npm/vant@2.12/lib/vant.min.js',
      'https://cdn.staticfile.org/axios/0.18.0/axios.min.js',
      'https://cdn.staticfile.org/lodash.js/4.17.11/lodash.min.js',
    ]
  }
}

module.exports = {
  publicPath:isProd ? './':'/',
  configureWebpack: {
    plugins,
    module: {},
    externals
  },
  chainWebpack: config => {
    // 配置 webpack-plugin-html 插件中的内容。 args[0] 表示配置信息，增加cdn变量
    config.plugin('html').tap(args => {
      args[0].cdn = cdn
      return args // 需要return
    })
  }
}