Bootstrap 4自定义构建生成器/下载 [英] Bootstrap 4 custom build generator / download

问题描述

有人知道有关alpha/beta bootstrap 4自定义生成器的信息，该信息可在自定义并下载?

Does anyone know about an alpha/beta bootstrap 4 custom generator, same that is available for bootstrap 3 at Customize and download?

https://getbootstrap.com/docs/4.0/customize/仍然不可用

https://getbootstrap.com/docs/4.0/customize/ still unavailable

推荐答案

如此处所述， Bootstrap 4的定制程序.这意味着您需要自己设置构建工具.这是我的工作流程(在NodeJS中):

As discussed here, there will not be a customizer for Bootstrap 4. This means that you'll need to set up build tools for yourself. This is my workflow (in NodeJS):

1. 使用npm init
创建一个新项目
2. 使用npm install bootstrap
安装Bootstrap
3. 安装构建工具.为了简化操作，只需要使用一个命令，我们将使用scss-powertools(我是它的作者).如果您不想使用它，则必须自己设置编译，前缀，最小化(和掉毛). 运行:npm install scss-powertools --save-dev
4. 在scss文件夹(在项目的根目录中)中创建SCSS文件，例如scss/name.scss
5. 在SCSS文件中，使用@import "bootstrap/scss/bootstrap";导入Bootstrap或导入单个组件根据需要
6. 将新脚本添加到package.json:"build": "scss-powertools scss/name.scss output/compiled.css"
7. 运行npm run build，您将在output/compiled.css中找到已编译的CSS (或您在build命令中指定为选项的任何内容)

1. Create a new project with npm init
2. Install Bootstrap with npm install bootstrap
3. Install build tools. To make this easy and only need to use one command, we'll use scss-powertools (I am the author of it). If you don't want to use it, you have to set up compiling, prefixing, minifying (and linting) yourself. Run: npm install scss-powertools --save-dev
4. Create the SCSS file in a scss folder (in the root of your project), like scss/name.scss
5. In the SCSS file import Bootstrap with @import "bootstrap/scss/bootstrap"; or import the individual components as you need them
6. Add a new script to package.json: "build": "scss-powertools scss/name.scss output/compiled.css"
7. Run npm run build, you will find your compiled CSS in output/compiled.css (or whatever you have specified as an option in the build command)

通知！ scss-powertools默认情况下不会缩小.要启用它，请使用--production标志.您可以在此处找到所有相关信息.

Notice! scss-powertools doesn't minify by default. To enable it use the --production flag. You can find all information about it here.

可以从以下要点中找到简单的设置.

Simple setup can be found from this Gist.

您可以在此处中找到我以前的工作流程.在其中，我必须手动设置从编译到整理的所有内容.

You can find my previous workflow here. In it I had to set up everything from compilation to linting manually.

这篇关于Bootstrap 4自定义构建生成器/下载的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！