const path = require('path')
const webpack = require('webpack');
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
const CompressionPlugin = require("compression-webpack-plugin");
const AddAssetHtmlPlugin = require("add-asset-html-webpack-plugin");
const VueRouterInvokeWebpackPlugin = require('vue-router-invoke-webpack-plugin');
const $config = require("./build/config")
const root = path.resolve($config.modules_root, $config.modules_dir);
const isProd = () => {
  return process.env.NODE_ENV === 'production';
};

let plugins = [];
plugins.push(
  // 将 dll 注入到 生成的 html 模板中
  new AddAssetHtmlPlugin({
    // dll文件位置
    filepath: path.resolve(root, '*.js'),
    // dll 引用路径
    publicPath: $config.modules_dir,
    // dll最终输出的目录
    outputPath: $config.modules_dir
  })
)
plugins.push(
  // 将 dll 注入到 生成的 html 模板中
  new AddAssetHtmlPlugin({
    // dll文件位置
    filepath: path.resolve(root, '*.css'),
    // dll 引用路径
    publicPath: $config.modules_dir,
    // dll最终输出的目录
    typeOfAsset: 'css',
    outputPath: $config.modules_dir
  })
)
let modules = Object.keys($config.modules);
modules.forEach(module => {
  plugins.push(new webpack.DllReferencePlugin({
    context: process.cwd(),
    manifest: require(path.resolve(root, `${module}-manifest.json`))
  }), )
})
if (isProd()) {
  plugins.push(new BundleAnalyzerPlugin())
  plugins.push(new CompressionPlugin({
    test: /\.js$|\.html$|\.css/,
    threshold: 10240,
    deleteOriginalAssets: false
  }));
}


module.exports = {
  publicPath: process.env.NODE_ENV === 'production' ?
    './' : '/',
  assetsDir: 'static',
  productionSourceMap: false,
  // 以下是必须的，如果你要编译完成之后打印二维码的话
  devServer: {
    open: true,
    host: '0.0.0.0',
    // 要保证不会冲突，否则二维码不对
    port: 3200,
    https: false,
    compress: true,
    hotOnly: false,
    overlay: {
      warnings: false,
      errors: true
    }
  },
  css: {
    // 是否使用css分离插件 ExtractTextPlugin
    extract: isProd() ? true : false,
    // 开启 CSS source maps?
    sourceMap: isProd() ? true : false,
    // css预设器配置项
    loaderOptions: {
      scss: {
        prependData: `
          @import "~@/assets/style/utils.scss";
        `
      },
    },
    // requireModuleExtension: false,
  },
  chainWebpack: config => {},
  configureWebpack: (config) => {
    return {
      resolve: {
        alias: {
          '@': path.resolve('src')
        }
      },
      plugins: [
        new webpack.ProvidePlugin({
          // _: "lodash",
          // $: "jquery"
        }),
        new webpack.BannerPlugin('文件头声明'),
        // https://github.com/cklwblove/vue-preset/blob/master/generator/index.js
        // https://zhuanlan.zhihu.com/p/63079674
        new VueRouterInvokeWebpackPlugin({
          dir: 'src/views',
          alias: '@/views',
          mode: 'hash',
          base: process.env.BASE_URL,
          ignore: ['images', 'components', 'NotFound.vue', /\.scss$/],
          notFound: '@/views/NotFound.vue',

          routerDir: 'src/router',
          redirect: [{
            redirect: '/home',
            path: '/'
          }]
        }),
        ...plugins
      ],
      externals: {}
    }
  }
}