twitter bootstrap 从源代码制作 [英] twitter bootstrap make from source
问题描述
所以我试图从源 git://github.com/twitter/bootstrap.git 中构建"twitter bootstrap,然后我将它克隆到我的本地机器上.
So I am trying to "build" twitter bootstrap from source git://github.com/twitter/bootstrap.git and I git clone it to my local machine.
显然,在我的本地机器上,我已经安装了 nodejs 和 npm,并且还安装了所需的 node 包和 uglify-js.并且所有节点模块都在我的系统路径中,因此我的终端中可以使用lessc"和uglifyjs"命令.
Obviously, on my local machine, I have had nodejs and npm installed and the required node packages less and uglify-js installed as well. And all node modules are in my system path so "lessc" and "uglifyjs" commands are available in my terminal.
进入引导程序的根目录,我运行make",这是输出:-
Going into bootstrap's root directory, I run "make" and this is the output:-
(luc)calvins-MacBook.local ttys002 Fri Feb 03 10:51:29 |~/work/luc/static/bootstrap|
calvin$ make
mkdir -p bootstrap/img
mkdir -p bootstrap/css
mkdir -p bootstrap/js
cp img/* bootstrap/img/
lessc ./less/bootstrap.less > bootstrap/css/bootstrap.css
lessc --compress ./less/bootstrap.less > bootstrap/css/bootstrap.min.css
lessc ./less/responsive.less > bootstrap/css/bootstrap.responsive
lessc --compress ./less/responsive.less > bootstrap/css/bootstrap.min.responsive
cat js/bootstrap-transition.js js/bootstrap-alert.js js/bootstrap-button.js js/bootstrap-carousel.js js/bootstrap-collapse.js js/bootstrap-dropdown.js js/bootstrap-modal.js js/bootstrap-tooltip.js js/bootstrap-popover.js js/bootstrap-scrollspy.js js/bootstrap-tab.js js/bootstrap-typeahead.js > bootstrap/js/bootstrap.js
uglifyjs -nc bootstrap/js/bootstrap.js > bootstrap/js/bootstrap.min.js
zip -r docs/assets/bootstrap.zip bootstrap
updating: bootstrap/ (stored 0%)
updating: bootstrap/css/ (stored 0%)
updating: bootstrap/css/bootstrap.css (deflated 85%)
updating: bootstrap/css/bootstrap.min.css (deflated 84%)
updating: bootstrap/css/bootstrap.min.responsive (deflated 76%)
updating: bootstrap/css/bootstrap.responsive (deflated 79%)
updating: bootstrap/img/ (stored 0%)
updating: bootstrap/img/glyphicons-halflings-white.png (deflated 4%)
updating: bootstrap/img/glyphicons-halflings.png (deflated 4%)
updating: bootstrap/js/ (stored 0%)
updating: bootstrap/js/bootstrap.js (deflated 82%)
updating: bootstrap/js/bootstrap.min.js (deflated 74%)
rm -r bootstrap
lessc ./less/bootstrap.less > ./docs/assets/css/bootstrap.css
lessc ./less/responsive.less > ./docs/assets/css/bootstrap-responsive.css
node docs/build
cp img/* docs/assets/img/
cp js/*.js docs/assets/js/
cp js/tests/vendor/jquery.js docs/assets/js/
cp js/tests/vendor/jquery.js docs/assets/js/
接下来我应该怎么做才能将我的 css 文件包含在我的 html 页面中?我没有看到构建/创建的 bootstrap.min.css 或 bootstrap.min.responsive 文件所在的位置.唯一似乎改变的是创建了一个bootstrap.zip",如上面运行 git status 所见.
What should I do next to include my css files in my html page? I don't see where the built/created bootstrap.min.css or bootstrap.min.responsive files are located. The only thing that seemed to have changed is that a "bootstrap.zip" was created, as seen by running git status above.
(luc)calvins-MacBook.local ttys002 Fri Feb 03 10:51:35 |~/work/luc/static/bootstrap|
calvin$ git status
# Not currently on any branch.
# Changes not staged for commit:
# (use "git add <file>..." to update what will be committed)
# (use "git checkout -- <file>..." to discard changes in working directory)
#
# modified: docs/assets/bootstrap.zip
#
no changes added to commit (use "git add" and/or "git commit -a")
推荐答案
凭任何想象力都不是这方面的专家(也刚开始玩 Twitter 引导程序),但是当我得到与您类似的输出时我只是运行 make
.但是,如果您运行 make bootstrap
,它会生成一个名为 bootstrap
的文件夹,据我所知,其中包含已编译的 css:
Not an expert on this by any stretch of the imagination (just started to play around with Twitter bootstrap as well), but I get a similar output as you when I just run make
. However, if you run make bootstrap
it generates a folder entitled bootstrap
that contains the compiled css as far as I can tell:
make bootstrap
mkdir -p bootstrap/img
mkdir -p bootstrap/css
mkdir -p bootstrap/js
cp img/* bootstrap/img/
lessc ./less/bootstrap.less > bootstrap/css/bootstrap.css
lessc --compress ./less/bootstrap.less > bootstrap/css/bootstrap.min.css
lessc ./less/responsive.less > bootstrap/css/bootstrap-responsive.css
lessc --compress ./less/responsive.less > bootstrap/css/bootstrap-responsive.min.css
cat js/bootstrap-transition.js js/bootstrap-alert.js js/bootstrap-button.js js/bootstrap-carousel.js js/bootstrap-collapse.js js/bootstrap-dropdown.js js/bootstrap-modal.js js/bootstrap-tooltip.js js/bootstrap-popover.js js/bootstrap-scrollspy.js js/bootstrap-tab.js js/bootstrap-typeahead.js > bootstrap/js/bootstrap.js
uglifyjs -nc bootstrap/js/bootstrap.js > bootstrap/js/bootstrap.min.js
新的 bootstrap
目录 (bootstrap/bootstrap
) 包含以下内容:
The new bootstrap
directory (bootstrap/bootstrap
) contains the following:
bootstrap/css:
- bootstrap-responsive.css
- bootstrap-responsive.min.css
- bootstrap.css
- bootstrap.min.css
bootstrap/img:
- glyphicons-halflings-white.png
- glyphicons-halflings.png
bootstrap/js:
- bootstrap.js
- bootstrap.min.js
这可能是文档的问题,遗漏了正确的命令,但我不确定.我对 Makefile
如何工作的记忆是,如果你在没有目标的情况下发出 make
,它默认为 makefile 中的第一个目标.在这种情况下,该目标是 docs
而不是 bootstrap
.
This might be an issue with the documentation, leaving out the correct command, but I'm not sure. My memory of how a Makefile
works is if you issue make
without a target, it defaults to the first target in the makefile. In this case, that target is docs
instead of bootstrap
.
我认为您可以将新引导程序目录的内容复制到您通常为项目放置 css/js 资产的任何位置.
I think you can then just copy the contents of the new bootstrap directory to wherever you would normally put the css/js assets for your project.
这篇关于twitter bootstrap 从源代码制作的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!