Entry#

• 类型： string | string[] | Record<string, string | string[] | EntryDescription> | Function
• 默认值：'./src/index.js'

入口：该选项用于设置 Rspack 构建的入口。

单个入口#

当你构建一个单页面应用（SPA），或是构建一个库时，通常只需要设置单个入口。

设置单个入口时，直接将入口模块的路径作为字符串传入 entry 配置项即可。

module.exports = {
  entry: './src/index.js',
};

以上写法会自动将入口模块的名称设置为 main，等价于以下写法：

module.exports = {
  entry: {
    main: './src/index.js',
  },
};

路径类型#

入口模块的路径可以是一个相对路径，也可以是一个绝对路径。

当 entry 被设置为相对路径时，Rspack 会使用 context 配置项 设置的值作为基础路径，默认为 Node.js 进程的当前工作目录，即 process.cwd()。

你也可以使用 Node.js 中的 path 模块 来生成一个绝对路径，并传递给 entry 配置项：

const path = require('path');

module.exports = {
  entry: path.join(__dirname, './src/index.js'),
};

入口数组#

在设置入口的值时，除了设置为 string，你也可以传入一个 string[]，这代表该入口中包含多个入口模块。

比如以下示例，会将 pre.js 和 post.js 构建到 page 的产物中。

module.exports = {
  entry: {
    page: ['./src/pre.js', './src/post.js'],
  },
};

多个模块会按照数组定义的顺序依次执行，因此 pre.js 的代码会早于 post.js 的代码执行。

多个入口#

当你需要同时构建多个入口时，你需要将 entry 设置为一个对象，对象的每一个 key 对应一个入口名称。

比如以下示例，会将 page1 和 page2 作为两个入口进行构建：

module.exports = {
  entry: {
    page1: './src/page1/index.js',
    page2: './src/page2/index.js',
  },
};

入口描述对象#

当你将 entry 设置为一个对象时，可以将入口的值设置为一个描述对象。描述对象可以包含以下属性：

EntryDescription.import#

• 类型： string[] | string
• 默认值：'./src/index.js'

一个或多个入口模块的路径。

module.exports = {
  entry: {
    foo: {
      import: './src/foo.js',
    },
  },
};

import 属性可以设置多个路径：

module.exports = {
  entry: {
    foo: {
      import: ['./src/foo.js', './src/bar.js'],
    },
  },
};

EntryDescription.runtime#

• 类型： false | string
• 默认值：undefined

运行时 chunk 的名称。设置 runtime 后，会创建一个新的运行时 chunk。你也可以将它设置为 false 来避免一个新的运行时 chunk。

runtime 属性用于设置运行时 chunk 的名称，比如将 main 入口的 chunk 名称设置为 'foo'：

module.exports = {
  entry: {
    main: {
      import: './src/index.js',
      runtime: 'foo',
    },
  },
};

EntryDescription.chunkLoading#

• 类型： false | string | 'jsonp' | 'import-scripts' | 'require' | 'async-node' | 'import'
• 默认值：undefined

设置当前入口在加载 chunk 时的加载方式。默认包含的方式有 'jsonp' (web), 'import' (ESM), 'import-scripts' (WebWorker), 'require' (sync node.js), 'async-node' (async node.js)，其他方式可由插件提供。

EntryDescription.asyncChunks#

• 类型： boolean
• 默认值：true

是否为当前入口创建按需加载的异步 chunk。

EntryDescription.publicPath#

• 类型： 'auto' | string | (pathData: PathData, assetInfo?: AssetInfo) => string
• 默认值：undefined

修改当前入口引用的资源的 publicPath。

EntryDescription.baseUri#

• 类型： string
• 默认值：undefined

修改当前入口引用的资源的 baseURI。

EntryDescription.filename#

• 类型： string
• 默认值：undefined

修改当前入口所生成 chunk 的文件名。

EntryDescription.library#

• 类型： string | string[] | object
• 默认值：undefined

修改当前入口所生成 chunk 作为库的导出格式，详细配置可参考 output.library。

EntryDescription.dependOn#

• 类型： string[] | string
• 默认值：undefined

设置当前入口所依赖的入口。使用 dependOn 选项你可以与另一个入口 chunk 共享模块。

EntryDescription.wasmLoading#

• 类型： 'fetch' | 'async-node'
• 默认值：undefined

设置当前入口加载 WebAssembly 模块的方式。默认可使用的方式有 'fetch'（web/WebWorker），'async-node'（Node.js），其他额外方式可由插件提供。

其默认值会根据 target 的变化而变化：

• 如果 target 设置为 'web'，'webworker'，'electron-renderer' 或 'node-webkit' 其中之一，其默认值为 'fetch'。
• 如果 target 设置为 'node'，'async-node'，'electron-main' 或 'electron-preload'，其默认值为 'async-node'。

EntryDescription.layer#

• 类型： string | null | undefined
• 默认值：undefined

指定当前入口的模块所在的 layer。用于在 split chunks, rules、stats、externals 中通过 layer 匹配使对应的配置生效。

module.exports = {
  entry: {
    index: {
      import: './src/index.js',
      layer: 'layer-name',
    },
  },
  experiments: {
    layers: true,
  },
};

动态入口#

如果传入一个函数，那么它将会在每次 make 事件中被调用。

要注意的是，make 事件在 webpack 启动和每当监听文件变化时都会触发。

module.exports = {
  //...
  entry: () => './demo',
};

或者：

module.exports = {
  //...
  entry: () => new Promise(resolve => resolve(['./demo', './demo2'])),
};

例如，你可以使用动态入口来从外部来源（远程服务器，文件系统内容或者数据库）获取真正的入口：

module.exports = {
  entry() {
    return fetchPathsFromSomeExternalSource(); // 返回一个会被用像 ['src/main-layout.js', 'src/admin-layout.js'] 的东西 resolve 的 promise
  },
};

当和 output.library 选项结合：如果传入的是一个数组，只有数组的最后一个条目会被导出。