我如何确切知道要包含哪些 Bootstrap SCSS 资产?
How do I know exactly which Bootstrap SCSS assets to include?
根据Bootstrapdocumentation,当我们想要包含SASS个模块时,我们应该使用
// Custom.scss
// Option B: Include parts of Bootstrap
// 1. Include functions first (so you can manipulate colors, SVGs, calc, etc)
@import "../node_modules/bootstrap/scss/functions";
// 2. Include any default variable overrides here
// 3. Include remainder of required Bootstrap stylesheets
@import "../node_modules/bootstrap/scss/variables";
@import "../node_modules/bootstrap/scss/mixins";
// 4. Include any optional Bootstrap components as you like
@import "../node_modules/bootstrap/scss/root";
@import "../node_modules/bootstrap/scss/reboot";
@import "../node_modules/bootstrap/scss/type";
@import "../node_modules/bootstrap/scss/images";
@import "../node_modules/bootstrap/scss/containers";
@import "../node_modules/bootstrap/scss/grid";
// 5. Add additional custom code here
目录 bootstrap/scss
包含所有这些文件:
-a---- 26-10-1985 10:15 2621 _accordion.scss
-a---- 26-10-1985 10:15 1474 _alert.scss
-a---- 26-10-1985 10:15 624 _badge.scss
-a---- 26-10-1985 10:15 923 _breadcrumb.scss
-a---- 26-10-1985 10:15 2969 _button-group.scss
-a---- 26-10-1985 10:15 2232 _buttons.scss
-a---- 26-10-1985 10:15 4800 _card.scss
-a---- 26-10-1985 10:15 5625 _carousel.scss
-a---- 26-10-1985 10:15 1127 _close.scss
-a---- 26-10-1985 10:15 1196 _containers.scss
-a---- 26-10-1985 10:15 5501 _dropdown.scss
-a---- 26-10-1985 10:15 256 _forms.scss
-a---- 26-10-1985 10:15 10621 _functions.scss
-a---- 26-10-1985 10:15 602 _grid.scss
-a---- 26-10-1985 10:15 266 _helpers.scss
-a---- 26-10-1985 10:15 1158 _images.scss
-a---- 26-10-1985 10:15 4552 _list-group.scss
-a---- 26-10-1985 10:15 899 _mixins.scss
-a---- 26-10-1985 10:15 5658 _modal.scss
-a---- 26-10-1985 10:15 2668 _nav.scss
-a---- 26-10-1985 10:15 7536 _navbar.scss
-a---- 26-10-1985 10:15 1933 _offcanvas.scss
-a---- 26-10-1985 10:15 1681 _pagination.scss
-a---- 26-10-1985 10:15 859 _placeholders.scss
-a---- 26-10-1985 10:15 4402 _popover.scss
-a---- 26-10-1985 10:15 1169 _progress.scss
-a---- 26-10-1985 10:15 12571 _reboot.scss
-a---- 26-10-1985 10:15 1880 _root.scss
-a---- 26-10-1985 10:15 1521 _spinners.scss
-a---- 26-10-1985 10:15 4215 _tables.scss
-a---- 26-10-1985 10:15 1168 _toasts.scss
-a---- 26-10-1985 10:15 2608 _tooltip.scss
-a---- 26-10-1985 10:15 425 _transitions.scss
-a---- 26-10-1985 10:15 1344 _type.scss
-a---- 26-10-1985 10:15 14038 _utilities.scss
-a---- 26-10-1985 10:15 67864 _variables.scss
如何准确知道要包括哪些资产?有没有table解释一下?
绝大多数可选文件是component-specific。您可以通过浏览文档的组件部分来决定是否需要给定组件。
例如_accordion.scss
对应Accordion Component。打算使用它?包括它!如果没有,请跳过它。
任何不属于组件的内容都记录在 Bootstrap 的布局(例如 _grid.scss
)、内容(例如 _type.scss
)、表单、助手或实用程序部分。
您可以在 Bootstrap 文档中找到所有这些内容。查看 table 个内容或使用每个内容的搜索功能。
根据Bootstrapdocumentation,当我们想要包含SASS个模块时,我们应该使用
// Custom.scss
// Option B: Include parts of Bootstrap
// 1. Include functions first (so you can manipulate colors, SVGs, calc, etc)
@import "../node_modules/bootstrap/scss/functions";
// 2. Include any default variable overrides here
// 3. Include remainder of required Bootstrap stylesheets
@import "../node_modules/bootstrap/scss/variables";
@import "../node_modules/bootstrap/scss/mixins";
// 4. Include any optional Bootstrap components as you like
@import "../node_modules/bootstrap/scss/root";
@import "../node_modules/bootstrap/scss/reboot";
@import "../node_modules/bootstrap/scss/type";
@import "../node_modules/bootstrap/scss/images";
@import "../node_modules/bootstrap/scss/containers";
@import "../node_modules/bootstrap/scss/grid";
// 5. Add additional custom code here
目录 bootstrap/scss
包含所有这些文件:
-a---- 26-10-1985 10:15 2621 _accordion.scss
-a---- 26-10-1985 10:15 1474 _alert.scss
-a---- 26-10-1985 10:15 624 _badge.scss
-a---- 26-10-1985 10:15 923 _breadcrumb.scss
-a---- 26-10-1985 10:15 2969 _button-group.scss
-a---- 26-10-1985 10:15 2232 _buttons.scss
-a---- 26-10-1985 10:15 4800 _card.scss
-a---- 26-10-1985 10:15 5625 _carousel.scss
-a---- 26-10-1985 10:15 1127 _close.scss
-a---- 26-10-1985 10:15 1196 _containers.scss
-a---- 26-10-1985 10:15 5501 _dropdown.scss
-a---- 26-10-1985 10:15 256 _forms.scss
-a---- 26-10-1985 10:15 10621 _functions.scss
-a---- 26-10-1985 10:15 602 _grid.scss
-a---- 26-10-1985 10:15 266 _helpers.scss
-a---- 26-10-1985 10:15 1158 _images.scss
-a---- 26-10-1985 10:15 4552 _list-group.scss
-a---- 26-10-1985 10:15 899 _mixins.scss
-a---- 26-10-1985 10:15 5658 _modal.scss
-a---- 26-10-1985 10:15 2668 _nav.scss
-a---- 26-10-1985 10:15 7536 _navbar.scss
-a---- 26-10-1985 10:15 1933 _offcanvas.scss
-a---- 26-10-1985 10:15 1681 _pagination.scss
-a---- 26-10-1985 10:15 859 _placeholders.scss
-a---- 26-10-1985 10:15 4402 _popover.scss
-a---- 26-10-1985 10:15 1169 _progress.scss
-a---- 26-10-1985 10:15 12571 _reboot.scss
-a---- 26-10-1985 10:15 1880 _root.scss
-a---- 26-10-1985 10:15 1521 _spinners.scss
-a---- 26-10-1985 10:15 4215 _tables.scss
-a---- 26-10-1985 10:15 1168 _toasts.scss
-a---- 26-10-1985 10:15 2608 _tooltip.scss
-a---- 26-10-1985 10:15 425 _transitions.scss
-a---- 26-10-1985 10:15 1344 _type.scss
-a---- 26-10-1985 10:15 14038 _utilities.scss
-a---- 26-10-1985 10:15 67864 _variables.scss
如何准确知道要包括哪些资产?有没有table解释一下?
绝大多数可选文件是component-specific。您可以通过浏览文档的组件部分来决定是否需要给定组件。
例如_accordion.scss
对应Accordion Component。打算使用它?包括它!如果没有,请跳过它。
任何不属于组件的内容都记录在 Bootstrap 的布局(例如 _grid.scss
)、内容(例如 _type.scss
)、表单、助手或实用程序部分。
您可以在 Bootstrap 文档中找到所有这些内容。查看 table 个内容或使用每个内容的搜索功能。