const path = require('path')
const webpack = require('webpack');
const debug = process.env.NODE_ENV !== 'production'
const Version = new Date().getTime()
const CompressionWebpackPlugin = require('compression-webpack-plugin');
const productionGzipExtensions = ['js', 'css'];
module.exports = {
    lintOnSave: false,
    publicPath: process.env.VUE_APP_PUBLICPATH,
    // assetsDir: 'static',
    productionSourceMap: false,
    outputDir: 'www',
    // chainWebpack: config => {
    //     // 移除 prefetch 插件
    //     config.plugins.delete('prefetch')
    // },
    pages: {
        index: {
            entry: 'src/main.js',
            template: 'public/index.html',
            filename: 'index.html',
            chunks: ['chunk-vendors', 'chunk-common', 'index'],
            cdn: {
                css: [
                    // 'https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css'
                ],
                js: [
                    // 'https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js',
                    // 'https://cdn.jsdelivr.net/npm/vue-router@3.2.0/dist/vue-router.min.js',
                    // 'https://cdn.jsdelivr.net/npm/vuex@3.5.1/dist/vuex.min.js',
                    // 'https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js',
                    // 'https://cdn.jsdelivr.net/npm/axios@0.19.2/dist/axios.min.js'
                ]
            }
        }
    },
    css: {
        // 是否使用css分离插件 ExtractTextPlugin
        extract: {
            // 修改打包后css文件名
            filename: `css/[name].${Version}.css`,
            chunkFilename: `css/[name].${Version}.css`
        }
    },
    configureWebpack: config => {
        // webpack配置，值位对象时会合并配置，为方法时会改写配置
        if (debug) {
            // 开发环境配置
            config.devtool = 'cheap-module-eval-source-map'
        } else {
            // config.optimization.minimizer[0].options.terserOptions.compress.drop_console = true
            // config.optimization.minimizer[0].options.terserOptions.compress.pure_funcs = ['console.log']
            config.plugins.push(
                new CompressionWebpackPlugin({
                    algorithm: 'gzip',
                    test: new RegExp('\\.(' + productionGzipExtensions.join('|') + ')$'),
                    threshold: 10240,
                    minRatio: 0.8,
                }),
                new webpack.optimize.LimitChunkCountPlugin({
                    maxChunks: 10, // 必须大于或等于 1
                    minChunkSize: 10000
                })
            );
        }
        // config.externals = {
        //   'element-ui': 'ELEMENT',
        //   vue: 'Vue',
        //   'vue-router': 'VueRouter',
        //   vuex: 'Vuex',
        //   axios: 'axios'
        // }
        Object.assign(config, {
            // 关闭 webpack 的性能提示
            performance: {
                hints: false
            },
            // 开发生产共同配置，配置别名
            resolve: {
                alias: {
                    '@': path.resolve(__dirname, './src'),
                    '@api': path.resolve(__dirname, './src/api'),
                    vue$: 'vue/dist/vue.esm.js'
                }
            }
        })
    },
    devServer: {
        open: true,
        https: false,
        hotOnly: false,
        host: '0.0.0.0',
        port: 8081,
        proxy: {
            '/api': {
                target: process.env.VUE_APP_API_BASE_URL,
                changeOrigin: true,
                ws: true,
                pathRewrite: {
                    '^/api': ''
                }
            }
        },
        before: app => { }
    }
}