引导Git子模块工作流
我以前在项目中使用过Bootstrap,但是我总是下载预编译的Bootstrap文件。虽然这在过去很容易奏效,但也有一些缺点。
- 在更新Bootstrap时,我必须记住下载预编译代码并更新本地Git存储库中的文件。如果我记得做的话,并不难。
- 我没有得到使用无引导混合和变量的好处。
- 我对引导代码所做的任何更改都保存在我自己的项目专用Git存储库中。
因此,现在是时候在Git存储库中将引导程序作为子模块添加了。首先我将fork Bootstrap,然后我将添加子模块并编译Bootstrap。
GitHub上的Fork bootstrap
我选择做的第一件事就是用叉子叉引导项目。这样做的目的是,如果我想对引导代码进行任何更改,我可以这样做,并将更改提交到我的分叉的副本(可选地发出一个pull请求)。
添加引导子模块
派生引导程序之后,下一步是将引导子模块添加到现有的Git存储库中。我将把子模块放在src/less/bootstrap文件夹中。
美元git子模块添加git@github.com:蓝色/ bootstrap.git src /不/引导
注意,您需要将上面一行中的SSH克隆URL替换为基于您的fork的URL。或者,如果您不希望派生引导库,那么输入引导项目的SSH克隆URL。
美元git子模块添加git@github.com:材质/ bootstrap.git src /不/引导
添加子模块后,将下载用于引导的完整源代码(在旧版本的Git中不是这样的)。
进口bootstrap.less
最后一步是导入基本引导程序。更少的文件。我有一个基本的风格。我用更少的文件来导入所有的文件。我只需要在文件的顶部添加以下行:
@ import“引导/ / bootstrap.less少”;
现在我可以使用Bootstrap LESS变量和mixin,包括媒体查询变量。
建立引导
您还可以选择从源代码构建bootstrap.css文件。Bootstrap在构建过程中使用Grunt。因此,我们将首先安装Grunt,然后使用node包管理器安装包依赖关系,最后使用Grunt构建Bootstrap。
安装咕哝:
npm美元安装- g grunt-cli
安装的依赖关系:
美元cdsrc /不/引导美元npm安装
编译引导:
美元的呼噜声
阅读更多
然后可以修改grunt文件,从dist/目录中获取bootstrap.min.css文件。你可以阅读更多关于使用引导较少的变量和mixin。我还建议使用LESS Hat项目提供了大量有用的mixin这使得跨浏览器特性支持更加容易。