const tsImportPluginFactory = require('ts-import-plugin'); // 按需加载

const path = require('path');
const resolve = (dir) => {
  return path.resolve(process.cwd(), dir);
};

module.exports = {
  entry: {
    index: './src/index.tsx',
    framework: ['react', 'react-dom'],
  },
  output: {
    path: path.resolve(__dirname, '../dist'),
    sourceMapFilename: '[name].map',
    chunkFilename: 'static/js/[name].[chunkhash:8].js',
    filename: 'static/js/[name].[hash:8].js',
  },
  // stats: 'errors-warnings',

  resolve: {
    // 设置别名
    alias: {
      '@': resolve('src'), // 这样配置后 @ 可以指向 src 目录
    },
  },
  module: {
    rules: [
      {
        test: /\.(jsx|tsx|js|ts)$/,
        loader: 'ts-loader',
        options: {
          transpileOnly: true,
          getCustomTransformers: () => ({
            before: [tsImportPluginFactory(/** options */)],
          }),
          compilerOptions: {
            module: 'es2015',
          },
        },
        exclude: /node_modules/,
      },
      /*{
        test: /\.(j|t)sx?$/,
        include: [resolve("src")],
        exclude: /node_modules/,
        loader: "babel-loader",
        options: {
          presets: [
            [
              "@babel/preset-env",
              {
                targets: { ie: 9 },
                ignoreBrowserslistConfig: true,
                useBuiltIns: false,
                modules: false,
                exclude: ["transform-typeof-symbol"]
              }
            ],
            [
              "@babel/preset-react",
              {
                targets: "last 2 versions, ie 11",
                modules: false
              }
            ],
            ["@babel/preset-typescript"]
          ],
          plugins: [
            ["@babel/plugin-syntax-dynamic-import"],
            ["@babel/plugin-proposal-decorators", { legacy: true }],
            ["@babel/plugin-proposal-class-properties", { loose: true }]
          ],
          sourceMap: true
        }
      },*/
      {
        test: /\.(png|jpe?g|gif|webp)(\?.*)?$/,
        use: [
          {
            loader: 'url-loader',
            options: {
              name: '[name].[ext]',
              outputPath: 'images/',
              limit: 4096,
              fallback: {
                loader: 'file-loader',
                options: {
                  name: 'img/[name].[hash:8].[ext]',
                },
              },
            },
          },
        ],
      },
      {
        test: /\.(eot|ttf|svg|woff|woff2)$/,
        use: {
          loader: 'file-loader',
          options: {
            name: '[name]_[hash].[ext]',
            outputPath: 'font/',
          },
        },
      },
    ],
  },
};