如何编译bootstrap-4.0.0源码
来源:互联网 发布:淘宝商品类目 编辑:程序博客网 时间:2024/06/05 01:43
因为bootstrap 4.0.0将放弃less转用sass来处理css,所以开发环境需要装SASS插件(必须先安装Ruby)。
- 安装Ruby,略。
- 安装SASS
gem install sass
- 安装Node.js,略。
- 安装grunt
npm install -g grunt
- 安装node-sass,大多数环境正常。安装不成功的话可以看后面的手动编译css部分。
npm install -g node-sass
- grunt打包,加强制参数
grunt --force
- 在dist目录下编译出下列文件
|-- dist |-- css |-- bootstrap.css |-- bootstrap.css.map |-- bootstrap.min.css |-- bootstrap.min.css.map |-- js |-- bootstrap.js |-- bootstrap.min.js |-- npm.js |-- umd |-- alert.js |-- button.js |-- carousel.js |-- collapse.js |-- dropdown.js |-- modal.js |-- popover.js |-- scrollspy.js |-- tab.js |-- tooltip.js |-- util.js
- scsslint检查时可能会报错,可以将bundleExcc关掉,不用本地的
//You can choose to have your gems installed via bundler and if so, set this option to true to use the local gems. scsslint: { options: { bundleExec: false, config: 'scss/.scss-lint.yml', reporterOutput: null }, src: ['scss/*.scss', '!scss/_normalize.scss'] }
- 手动编译css,进入scss目录会看到大量的scss文件。主要关注下面几个
|-- scss |-- ... |-- bootstrap.scss |-- bootstrap-flex.scss |-- bootstrap-grid.scss |-- bootstrap-reboot.scss |-- ...
可以用sass命令直接生成相应的css文件和map文件
sass bootstrap.scss bootstrap.csssass bootstrap-flex.scss bootstrap-flex.csssass bootstrap-grid.scss bootstrap-grid.csssass bootstrap-reboot.scss bootstrap-reboot.css
- 源码包下载:http://download.csdn.net/detail/super2007/9558340
0 0
- 如何编译bootstrap-4.0.0源码
- 编译一个bootstrap源码文件
- 如何编译mina源码
- 如何编译Zookeeper源码
- 如何编译Docker源码
- 如何源码编译zeppelin
- 如何源码编译Livy
- 编译Bootstrap。
- 如何编译sqlite3.0.7源码
- 如何编译安装源码包
- 如何编译Android内核源码
- 如何编译安装源码包
- 如何编译nodemcu的源码?
- 如何从源码编译SITL
- 如何下载并编译Android 4.0内核源码Goldfish(图文)
- nessuswx源码在vc6.0下如何编译
- 如何下载并编译Android4.0内核源码goldfish(图文)
- 如何下载并编译Android4.0内核源码goldfish(图文)
- 鼠标浮动文本的实现
- iOS:如何优雅的让UITextView根据输入文字实时改变高度
- Winform 安装与布署
- python的subprocess模块使用方法
- UI控件之Date & Time组件(下)
- 如何编译bootstrap-4.0.0源码
- JavaWeb 服务启动时,在后台启动加载一个线程。
- 系统服务
- FMDB中出现的database is locked
- 7牛直播雲
- GitHub 中国区前 100 名到底是什么样的人?
- 提高项目7-太乐
- 哈佛结构和冯·诺依曼结构的区别
- bootstrap 模态框提交按钮之后就关闭模态框