参与贡献

工具设置

Bootstrap 使用 npm 脚本 来构建文档和编译源文件。我们的 package.json 包含了这些用于编译代码、运行测试等的脚本。这些脚本并不打算在我们仓库和文档之外使用。

要使用我们的构建系统并在本地运行我们的文档，你需要一份 Bootstrap 的源文件和 Node。按照以下步骤操作，你就可以准备就绪：

1. 下载并安装 Node.js，我们使用它来管理我们的依赖项。
2. 可以下载 Bootstrap 的源代码，或者叉子并克隆 Bootstrap 的仓库。
3. 导航到根目录 /bootstrap 并运行 npm install 来安装列在 package.json 中的本地依赖项。

完成后，你将能够从命令行运行提供的各种命令。

使用 npm 脚本

我们的 package.json 包含了用于开发项目的众多任务。在终端中运行 npm run 查看所有 npm 脚本。主要任务包括：

Sass

Bootstrap 使用 Dart Sass 将我们的 Sass 源文件编译成 CSS 文件（包含在我们的构建过程中），如果你使用自己的资源管道编译 Sass，也建议这样做。我们以前在 Bootstrap v4 中使用 Node Sass，但 LibSass 及其上构建的包，包括 Node Sass，现在已被弃用。

Dart Sass 使用 10 的舍入精度，并且出于效率原因不允许调整此值。我们在进一步处理生成的 CSS（例如在压缩过程中）时不会降低此精度，但如果你选择这样做，我们建议保持至少 6 的精度，以防止浏览器舍入问题。

PostCSS

Bootstrap 使用 PostCSS 通过多个插件处理我们编译后的 CSS：

• Autoprefixer 在构建时自动为 CSS 属性添加浏览器前缀。通过允许我们只编写一次 CSS 的关键部分，同时无需浏览器混入，从而节省时间和代码。我们在 GitHub 仓库的单独文件中维护通过 Autoprefixer 支持的浏览器列表。详情请参见 .browserslistrc。

• postcss-prefix-custom-properties 为所有 CSS 自定义属性（变量）添加 bs- 前缀。这使我们可以在 Sass 源代码中编写干净、无前缀的变量名（例如 --border-radius），在编译后的 CSS 中变为有前缀（例如 --bs-border-radius）。

我们的 PostCSS 配置位于 build/postcss.config.mjs。

JavaScript

我们的 JavaScript 源代码是用 TypeScript 编写的，位于 js/src/。我们使用 Rolldown（来自 Vite 团队的 Rust 基础打包工具）进行打包，然后使用 terser 对输出进行压缩。Bootstrap v5 使用 Rollup 和 Babel 来完成此操作。Rolldown 会去掉 TypeScript 类型并自行降低语法，因此我们不再需要 Babel。

Rolldown 不会读取 .browserslistrc，因此 build/browser-targets.mjs 在构建时解析该文件，并将其转换为 Rolldown 所期望的目标列表。因此两个管道都遵循同一个浏览器列表。

我们提供自己的 TypeScript 声明，因此你不需要 @types/bootstrap。我们的打包器配置位于 build/rolldown.config.mjs。

本地文档

在本地运行我们的文档需要使用 Astro。Astro 是一个现代静态网站生成器，它允许我们使用 Markdown 和 React 组件的组合来构建文档。以下是开始的方法：

1. 按照上面的工具设置完成所有依赖项的安装。
2. 在根/bootstrap目录下，在命令行中运行npm run docs-serve。
3. 在浏览器中打开 http://localhost:9001，就可以看到结果。

通过阅读其文档了解更多有关使用 Astro 的信息。

故障排除

如果在安装依赖项时遇到问题，请卸载所有以前的依赖项版本（全局和本地）。然后，重新运行 npm install。