text: // eslint-disable-next-line unicorn/import-style
  const { resolve } = require('path');
  const HtmlWebpackPlugin = require('html-webpack-plugin');
  const CopyPlugin = require('copy-webpack-plugin');
  const WebpackBar = require('webpackbar');
  const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin');
  const HardSourceWebpackPlugin = require('hard-source-webpack-plugin');
  const MiniCssExtractPlugin = require('mini-css-extract-plugin');
  
  const { PROJECT_PATH, isDev } = require('../constant');
  
  const getCssLoaders = (importLoaders) => [
      isDev ? 'style-loader' : MiniCssExtractPlugin.loader,
      {
          loader: 'css-loader',
          options: {
              modules: false,
              sourceMap: isDev,
              importLoaders,
          },
      },
      {
          loader: 'postcss-loader',
          options: {
              postcssOptions: {
                  plugins: [
                      require('postcss-preset-env')({
                          autoprefixer: {
                              grid: true,
                              flexbox: 'no-2009',
                          },
                          stage: 3,
                      }),
                      require('postcss-normalize'),
                  ],
              },
              sourceMap: isDev,
          },
      },
  ];
  
  module.exports = {
      entry: {
          index: resolve(PROJECT_PATH, './src/index.tsx'),
      },
      output: {
          filename: `[name]${isDev ? '' : '.[hash:8]'}.js`,
          path: resolve(PROJECT_PATH, './dist'),
      },
      resolve: {
          extensions: ['.tsx', '.ts', '.js', '.json'],
          alias: {
              '@': resolve(PROJECT_PATH, './src'),
          },
      },
      externals: {
          react: 'React',
          'react-dom': 'ReactDOM',
      },
      module: {
          rules: [
              {
                  test: /\.css$/,
                  use: getCssLoaders(1),
              },
              {
                  test: /\.s(c|a)ss$/,
                  use: [
                      ...getCssLoaders(2),
                      {
                          loader: 'sass-loader',
                          options: {
                              sourceMap: isDev,
                          },
                      },
                  ],
              },
              {
                  test: [/\.bmp$/, /\.gif$/, /\.jpe?g$/, /\.png$/],
                  use: [
                      {
                          loader: 'url-loader',
                          options: {
                              limit: 10 * 1024,
                              name: '[name].[contenthash:8].[ext]',
                              outputPath: 'assets/images',
                          },
                      },
                  ],
              },
              {
                  test: /\.(ttf|woff|woff2|eot|otf)$/,
                  use: [
                      {
                          loader: 'url-loader',
                          options: {
                              name: '[name].[contenthash:8].[ext]',
                              outputPath: 'assets/fonts',
                          },
                      },
                  ],
              },
              {
                  test: /\.(tsx?|js)$/,
                  loader: 'babel-loader',
                  options: { cacheDirectory: true },
                  exclude: /node_modules/,
              },
          ],
      },
      plugins: [
          new HtmlWebpackPlugin({
              template: resolve(PROJECT_PATH, 'public/index.html'),
              filename: 'index.html',
              cache: false,
              minify: isDev
                  ? false
                  : {
                        removeAttributeQuotes: true,
                        collapseWhitespace: true,
                        removeComments: true,
                        collapseBooleanAttributes: true,
                        collapseInlineTagWhitespace: true,
                        removeRedundantAttributes: true,
                        removeScriptTypeAttributes: true,
                        removeStyleLinkTypeAttributes: true,
                        minifyCSS: true,
                        minifyJS: true,
                        minifyURLs: true,
                        useShortDoctype: true,
                    },
          }),
          new CopyPlugin({
              patterns: [
                  {
                      context: resolve(PROJECT_PATH, './public'),
                      from: '*',
                      to: resolve(PROJECT_PATH, './dist'),
                      toType: 'dir',
                  },
              ],
          }),
          new WebpackBar({
              name: isDev ? '正在启动' : '正在打包',
              color: '#bdb4f0',
          }),
          new ForkTsCheckerWebpackPlugin({
              typescript: {
                  configFile: resolve(PROJECT_PATH, './tsconfig.json'),
              },
          }),
          new HardSourceWebpackPlugin(),
      ],
  };
  