打包配置

¥Bundling Configuration

🚧

此功能将在 v2 中被删除，转而使用基于 SWC 的打包器，如 Parcel 2 、涡轮机组、rspack 、fe-farm 。

¥This feature will be dropped in v2, in favor of SWC-based bundlers like Parcel 2 , Turbopack , rspack , fe-farm .

请使用其中一个打包器。

¥Please use one of the bundlers instead.

SWC 能够将多个 JavaScript 或 TypeScript 文件打包为一个。

¥SWC is able to bundle multiple JavaScript or TypeScript files into one.

该功能当前命名为 spack，但将在 v2 中重命名为 swcpack。spack.config.js 将在 swcpack.config.js 中被弃用。

¥This feature is currently named spack, but will be renamed to swcpack in v2. spack.config.js will be deprecated for swcpack.config.js.

查看打包的基本示例。

¥View a basic example of bundling .

配置

¥Configuration

你可以使用 spack.config.js 以及与 webpack 类似的选项来配置打包。未来，我们正在探索兼容 webpack 的插件系统。

¥You can configure bundling using spack.config.js with similar options to webpack. In the future, we are exploring a webpack compatible plugin system.

spack.config.js


 
module.exports = {
  entry: {
    web: __dirname + "/src/index.ts",
  },
  output: {
    path: __dirname + "/lib",
  },
};

注意：当前需要 CommonJS。未来将支持 ES 模块。

¥Note: CommonJS is currently required. In the future, ES Modules will be supported.

如果你想要配置的自动补齐或类型检查，你可以使用 @swc/core/spack 中的 config 函数封装导出。它是带有类型注释的恒等函数。

¥If you want auto-completion or type checking for configuration, you can wrap the export with a config function from @swc/core/spack. It’s an identity function with type annotation.

spack.config.js


const { config } = require("@swc/core/spack");
 
module.exports = config({
  entry: {
    web: __dirname + "/src/index.ts",
  },
  output: {
    path: __dirname + "/lib",
  },
});

mode

可能的值：production、debug、none。

¥Possible values: production, debug, none.

目前尚未使用该值，但其行为与 webpack 类似。

¥Currently this value is not used, but it will behave similarly to webpack.

entry

确定打包的条目。你可以指定一个文件或包名称到文件路径的映射。

¥Determines the entry of bundling. You may specify a file or a map of bundle name to file path.

注意：目前这应该是绝对路径。你可以使用 __dirname 创建一个。

¥Note: Currently this should be absolute path. You can use __dirname to create one.

将来，SWC 将支持使用相对路径，并将解析相对于 spack.config.js 的文件。

¥In the future, SWC will support using relative paths and will resolve files relative to spack.config.js.

output

你可以使用 output 更改打包程序的目标目录。

¥You can change destination directory of the bundler using output.

spack.config.js


const { config } = require("@swc/core/spack");
 
module.exports = config({
  output: {
    path: __dirname + "/lib",
    // Name is optional.
    name: "index.js",
  },
});

options

用于控制 SWC 的行为。该字段是可选的。

¥Used to control the behavior of SWC. This field is optional.