配置 WebPack 为 Typescript 导入

Question

typescript 的 webpack 配置教程显示如下：

const path = require('path');

module.exports = { ... }

将它用作 es 模块并使用 eg imports 配置它不是更好吗？ 或者有没有像上面那样配置的原因？ 我找不到任何配置如下的示例：

import webpack from "webpack";
import path from "path";

export default () => { ... }

Answer 1

TypeScript 和较新的 ES 标准是普通 JavaScript 的超集。使用广泛支持的语法和功能编写配置文件使其更广泛可用和可接受，而无需额外设置。

TypeScript 在某些方面是一种更好的做法，但您需要引入额外的依赖项和配置才能使用它，在某些组织中您甚至没有这种自由。 和ES类似，Node.js直到v12才原生支持mjs。

好消息是Webpack还支持包括TypeScript在内的多种语言编写配置，参见https://webpack.js.org/configuration/configuration-languages/

如果由于某种原因您不能直接编写 TypeScript，也可以通过使用 TypeScript JSDoc 注释来获取 IntelliSense 等功能：

/** @type { import('webpack').Configuration } */
const config = {...};
module.exports = config;