close
logologo
指南
配置
插件
API
社区
版本
更新日志
Rsbuild 0.x 文档
English
简体中文
指南
配置
插件
API
社区
更新日志
Rsbuild 0.x 文档
English
简体中文
logologo
Overview
root
mode
plugins
logLevel
environments

dev

dev.assetPrefix
dev.browserLogs
dev.cliShortcuts
dev.client
dev.hmr
dev.lazyCompilation
dev.liveReload
dev.progressBar
dev.setupMiddlewares
dev.watchFiles
dev.writeToDisk

resolve

resolve.aliasStrategy
resolve.alias
resolve.conditionNames
resolve.dedupe
resolve.extensions
resolve.mainFields

source

source.assetsInclude
source.decorators
source.define
source.entry
source.exclude
source.include
source.preEntry
source.transformImport
source.tsconfigPath

output

output.assetPrefix
output.charset
output.cleanDistPath
output.copy
output.cssModules
output.dataUriLimit
output.distPath
output.emitAssets
output.emitCss
output.externals
output.filenameHash
output.filename
output.injectStyles
output.inlineScripts
output.inlineStyles
output.legalComments
output.manifest
output.minify
output.module
output.overrideBrowserslist
output.polyfill
output.sourceMap
output.target

html

html.appIcon
html.crossorigin
html.favicon
html.inject
html.meta
html.mountId
html.outputStructure
html.scriptLoading
html.tags
html.templateParameters
html.template
html.title

server

server.base
server.compress
server.cors
server.headers
server.historyApiFallback
server.host
server.htmlFallback
server.https
server.middlewareMode
server.open
server.port
server.printUrls
server.proxy
server.publicDir
server.strictPort

security

security.nonce
security.sri

tools

tools.bundlerChain
tools.cssExtract
tools.cssLoader
tools.htmlPlugin
tools.lightningcssLoader
tools.postcss
tools.rspack
tools.styleLoader
tools.swc

performance

performance.buildCache
performance.bundleAnalyze
performance.chunkSplit
performance.dnsPrefetch
performance.preconnect
performance.prefetch
performance.preload
performance.printFileSize
performance.profile
performance.removeConsole
performance.removeMomentLocale

moduleFederation

moduleFederation.options
📝 在 GitHub 上编辑此页
上一页source.define
下一页source.exclude

#source.entry

  • 类型:
type Entry = Record<
  string,
  string | string[] | (Rspack.EntryDescription & { html?: boolean })
>;
  • 默认值:
const defaultEntry = {
  // Rsbuild 默认也支持其他后缀名,如 ts、tsx、jsx、mts、cts、mjs、cjs
  index: './src/index.js',
};

用于设置构建的入口模块。

source.entry 的值是一个对象,key 是入口名称,value 是入口模块的路径,或是一个 描述对象。

当 value 为路径时,它可以为绝对路径或相对路径,相对路径会基于 root 进行解析。

#HTML 生成

Rsbuild 会为 source.entry 中的每一个入口注册 html-rspack-plugin,并生成对应的 HTML 文件。

  • 示例:
rsbuild.config.ts
export default {
  source: {
    entry: {
      foo: './src/pages/foo/index.ts',
      bar: './src/pages/bar/index.ts',
    },
  },
};

生成的目录结构如下:

.
├── foo.html
├── bar.html
└── static
    ├── css
    │   ├── foo.css
    │   └── bar.css
    └── js
        ├── foo.js
        └── bar.js

如果你不需要生成 HTML 文件:

  • 将入口描述对象中的 html 属性设置为 false 来禁用单个入口的 HTML 生成。
  • 将 tools.htmlPlugin 设置为 false 来禁用所有入口的 HTML 生成。

#描述对象

source.entry 同样支持 Rspack 的 entry 描述对象写法,比如:

rsbuild.config.ts
export default {
  source: {
    entry: {
      foo: {
        import: './src/foo.js',
        runtime: 'foo',
      },
      bar: {
        import: './src/bar.js',
        runtime: 'bar',
      },
    },
  },
};

#html 属性

Rsbuild 为描述对象添加了 html 属性,用于控制是否生成 HTML 文件。

例如,bar 入口不生成 HTML 文件:

rsbuild.config.ts
export default {
  source: {
    entry: {
      foo: './src/foo.js',
      bar: {
        import: './src/bar.js',
        html: false,
      },
    },
  },
};

在上述例子中,构建时会生成 foo.html 文件,而 bar.html 文件不会生成。

关于描述对象的完整用法,请参考 Rspack - 入口描述对象。

#基于 environment 设置

当你面向多个 environments 构建时,可以为每个 environment 设置不同的 entry:

比如为 web 和 node 环境设置不同的 entry:

rsbuild.config.ts
export default {
  environments: {
    web: {
      source: {
        entry: {
          index: './src/index.client.js',
        },
      },
      output: {
        target: 'web',
      },
    },
    node: {
      source: {
        entry: {
          index: './src/index.server.js',
        },
      },
      output: {
        target: 'node',
      },
    },
  },
};

#异步设置

如果你需要异步设置 entry,例如使用 glob 来扫描目录,可以在 rsbuild.config.ts 中导出一个异步函数:

rsbuild.config.ts
import path from 'node:path';
import { glob } from 'glob';
import { defineConfig } from '@rsbuild/core';

export default defineConfig(async () => {
  const entryFiles = await glob('./src/**/main.{ts,tsx,js,jsx}');

  const entry = Object.fromEntries(
    entryFiles.map((file) => {
      const entryName = path.basename(path.dirname(file));
      return [entryName, `./${file}`];
    }),
  );

  return {
    source: {
      entry: entry,
    },
  };
});