Webpack 如何使用Typescript做为配置文件？

要使用typesccript做为webpack的配置文件首先要安装一些包。

#使用npm安装
npm i -D typescript ts-node @types/node @types/webpack
#使用yarn安装
yarn add --dev typescript ts-node @types/node @types/webpack

然后就是使用Teypscript写配置文件webpacck.config.ts了。

import * as webpack from "webpack";
import * as path from "path";

const config: webpack.Configuration = {
  mode: 'production',
  entry: './foo.js',
  output: {
    path: path.resolve(__dirname, 'dist'),
    filename: 'foo.bundle.js'
  }
};

export default config;

然后就是我们熟悉的tsconfig.json文件 我们可以使用命令tsc --init来自动生成一个tsconfig.json文件

{
    "compilerOptions":{
        "module": "commonjs",//该字段必须是commonjs
        "esModuleInterop": true
    },
    "exclude": [
        "node_modules",
        "webpack.config.tsx"
    ]
}

然后使用命令webpack -w的时候就会自动使用webpack.config.ts了