構建工具
了解如何使用 Bootstrap 包含的 npm 腳本來構建我們的文檔、編譯源代碼、運行測試等。
工具設置
Bootstrap為其構建系統使用npm 腳本。我們的package.json包含使用框架的便捷方法，包括編譯代碼、運行測試等。
要使用我們的構建系統並在本地運行我們的文檔，您需要一份 Bootstrap 源文件和 Node.js 的副本。按照這些步驟，你應該準備好搖滾：
- 下載並安裝 Node.js，我們用它來管理我們的依賴項。
- 下載 Bootstrap 的源代碼或fork Bootstrap 的存儲庫。
- 導航到根
/bootstrap目錄並運行以安裝我們在package.jsonnpm install中列出的本地依賴項。
完成後，您將能夠運行命令行提供的各種命令。
使用 npm 腳本
我們的package.json包含以下命令和任務：
| 任務 | 描述 |
|---|---|
npm run dist |
npm run dist創建/dist/包含編譯文件的目錄。使用Sass、Autoprefixer和terser。 |
npm test |
運行後在本地運行測試npm run dist |
npm run docs-serve |
在本地構建和運行文檔。 |
運行npm run以查看所有 npm 腳本。
薩斯
Bootstrap v4 使用Node Sass將我們的 Sass 源文件編譯成 CSS 文件（包含在我們的構建過程中）。為了在使用您自己的資產管道編譯 Sass 時生成相同的 CSS，您需要使用至少支持 Node Sass 所具有的功能的 Sass 編譯器。這一點很重要，因為自 2020 年 10 月 26 日起，LibSass 和基於它構建的軟件包（包括 Node Sass）已被棄用。
如果您需要更新的 Sass 功能或與更新的 CSS 標準的兼容性，Dart Sass現在是 Sass 的主要實現，並支持與 Node Sass 完全兼容的 JavaScript API（Dart Sass 的GitHub 頁面上列出了一些例外情況）。
我們將 Sass 舍入精度提高到 6（默認情況下，在 Node Sass 中為 5），以防止瀏覽器舍入問題。如果您使用 Dart Sass，則不需要進行調整，因為該編譯器使用 10 的捨入精度，並且出於效率原因不允許對其進行調整。
自動前綴
Bootstrap 使用Autoprefixer（包含在我們的構建過程中）在構建時自動將供應商前綴添加到某些 CSS 屬性。這樣做可以讓我們一次性編寫 CSS 的關鍵部分，同時消除對 v3 中的供應商 mixin 的需求，從而節省了我們的時間和代碼。
我們在 GitHub 存儲庫中的單獨文件中維護通過 Autoprefixer 支持的瀏覽器列表。有關詳細信息，請參閱.browserslistrc。
本地文檔
在本地運行我們的文檔需要使用通過hugo-bin npm 包安裝的Hugo。Hugo 是一個非常快速且可擴展的靜態站點生成器，它為我們提供：基本包含、基於 Markdown 的文件、模板等。以下是如何開始：
- 運行上面的工具設置以安裝所有依賴項。
- 從根
/bootstrap目錄，npm run docs-serve在命令行中運行。 http://localhost:9001/在瀏覽器中打開，瞧。
通過閱讀其文檔了解更多關於使用 Hugo 的信息。
故障排除
如果您在安裝依賴項時遇到問題，請卸載所有以前的依賴項版本（全局和本地）。然後，重新運行npm install。