const fs = require('fs')
const path = require('path')
const baseConfig = require('./webpack.base')
const { merge } = require('webpack-merge')
// 清除构建目录
const { CleanWebpackPlugin } = require('clean-webpack-plugin')
const VueLoaderPlugin = require('vue-loader/lib/plugin')
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
const TerserPlugin = require('terser-webpack-plugin')
const components = require('../components.json');
const ProgressBarPlugin = require('progress-bar-webpack-plugin');
var nodeExternals = require('webpack-node-externals');
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');

const resolve = name => {
    return path.resolve(__dirname, name)
}

let modules = {}

Object.keys(components).forEach(name => {
    modules[name] = path.join(__dirname, '../', components[name])
})


module.exports = {
    mode: 'production',
    entry: resolve('../src/index.js'),
    output: {
        path: path.resolve(__dirname, '../lib'),
        filename: 'vue-element-ui-plus.common.js',
        chunkFilename: '[id].js',
        libraryExport: 'default',
        library: 'VueElementUiPlus',
        libraryTarget: 'umd',
        umdNamedDefine: true,
        // globalObject: 'typeof self !== \'undefined\' ? self : this'
    },
    resolve: {
        extensions: ['.js', '.vue', '.json'],
        alias: {
            '@': path.join(__dirname, '../'),
            'element-ui': path.join(__dirname, '../')
        },
        modules: ['node_modules']
    },
    externals: [
        {
            vue: 'vue'
        },
        nodeExternals()
    ],
    performance: {
        hints: false
    },
    stats: {
        children: false
    },
    optimization: {
        minimize: true,
        minimizer: [
            // new TerserPlugin({
            //     terserOptions: {
            //         output: {
            //             comments: false
            //         }
            //     }
            // }),
            new UglifyJsPlugin({
                cache: true,
                parallel: true,
                sourceMap: false
            })
        ]
    },
    module: {
        rules: [
            // babel-loader 解析js
            {
                test: /\.(js|jsx)$/,
                use: {
                    loader: 'babel-loader',
                    options: {
                        presets: ['@babel/preset-env', '@vue/babel-preset-jsx']
                    }
                }
            },
            // vue-loader 解析 .vue 文件
            {
                test: /.vue$/,
                use: ['vue-loader']
            },
            //
            {
                test: /.(sa|sc|c)ss$/,
                use: ['style-loader', 'css-loader', 'postcss-loader', 'sass-loader']
            },
            /**
             * file-loader 解析 js引入图片、字体
             *      import logo from './images/logo.png'
             */
            {
                test: /.(png|jpg|jpeg|gif|webp|PNG)$/,
                type: 'asset',
                parser: {
                    dataUrlCondition: {
                        maxSize: 60 * 1024
                    }
                },
                generator: {
                    filename: 'img/[name][ext]'
                }
            },
            {
                test: /.(eot|woff|ttf|svg)$/,
                loader: 'file-loader',
            }

        ],

    },
    plugins: [
        new ProgressBarPlugin(),
        new VueLoaderPlugin()
    ]
};
