编译 Bootstrap 4.0 的坑。 HTML/CSS

axiuno 2017-8-30 1111

Bootstrap 4 Alpha 了6个版本,beta 了2个版本,拖的时间太长了,一直在跟进,最近又尝试编译了一下,发现还是坑多,记录下,前人踩坑,后人乘凉。

中文网站基本不用看了,因为更新太快,版本都落后,直接看英文官网吧。

官网:https://getbootstrap.com/

下载:https://getbootstrap.com/docs/4.0/getting-started/download/  建议用 git clone 的方式。

编译:https://getbootstrap.com/docs/4.0/getting-started/build-tools/  需要安装 node, ruby,会用到 npm gem 包管理方式,吐槽下,一个项目管理搞这么多语言合适么?我认为 node 完全能胜任。然后你最好能翻墙,否则很有可能会卡死。


1. 强烈推荐使用以下 node npm 版本:

    node -v   # 版本 6.11

    npm -v   # 版本 5.2 

    npm install npm@5.2

    (npm 5.3 会有各种坑)


2. npm install bootstrap@4.0.0-beta 没有 Gem 文件,需要直接从 git 下载:

 git clone https://github.com/twbs/bootstrap.git


3. npm 慢如死牛,设置源:

npm config set registry https://registry.npm.taobao.org 


4. ruby 设置源,首先要下载证书,放到 C:\Ruby23\cacert.pem
设置系统环境变量:

set SSL_CERT_FILE=C:\\Ruby23\\cacert.pem


5. 设置 ruby gem 源:

gem sources --remove https://rubygems.org/

gem sources -a https://ruby.taobao.org/

gem sources -l

备用:https://gems.ruby-china.org/ 

bundle config mirror.https://rubygems.org https://gems.ruby-china.org


6. 管理员启动 cmd


7. 重新编译部分模块:

 npm rebuild node-sass


npm cache clear --force

npm install

bundle install

npm run dist


上传的附件:
最新回复 (13)
  • axiuno 12月前
    引用 2

    gem 相关命令:


    gem  sources  --add  https://gems.ruby-china.org/  --remove  https://rubygems.org/
    gem  sources  -l

    sudo  gem  clea
    sudo  gem  install  foundatio
    sudo  npm  install  -g  bower  grunt-cl
    sudo  npm  instal
    grunt  buil
    grunt  /  grunt  serve  /  grunt  watch

  • axiuno 9月前
    引用 3
    最近编译  bootstrap  4  beta2  又碰到坑了。
    首先是  ruby  的库文件下载一半锁住后,一直没法继续,需要手工删除一下。
    rm  /c/ruby32/xxxx/xxx.gem

    然后是  npm  install  bootstrap-4@beta-2    的版本有问题,改为  git  clone  后解决了。
    git  clone  --depth=1  https://github.com/twbs/bootstrap.git
    cd  bootstrap
    npm  install
    bundle  install
    npm  run  dist
  • axiuno 8月前
    引用 4

    命令顺序如下:但是几乎每步一坑


    git clone https://github.com/twbs/bootstrap.git

    cd bootstrap/

    npm install

    gem install bundler

    bundle install

    npm run dist

    npm test

    npm run docs


  • Chilsion 8月前
    引用 5
    不知道Bootstrap  4正式版什么时候才能出来。
  • axiuno 8月前
    引用 6
    beta  3  已经出来了,正式版马上出来。
  • Chilsion 8月前
    引用 7
    axiuno beta 3 已经出来了,正式版马上出来。
    估计还得有个Beta  4。。。。。。
  • axiuno 8月前
    引用 8
    Chilsion 估计还得有个Beta 4。。。。。。
    bs  官方回复说下个版本就  release  了
  • axiuno 8月前
    引用 9

    最新的坑:  Ruby  大垃圾需要什么  DevKit:

    下载 DevKit: https://github.s3.amazonaws.com/downloads/oneclick/rubyinstaller/DevKit-tdm-32-4.5.1-20101214-1400-sfx.exe
    解压到  C:/DevKit
    配置  conf.yaml

    -  C:/Ruby2

    执行命令:

    cd  c:/DevKit
    ruby  dk.rb  init
    ruby  dk.rb  install

    相关讨论:https://github.com/beefproject/beef/issues/1387


    -----------------------------------------------------------------------

    经过摸索,ruby 编译的过程需要安装 make,windows 下通过 npm 安装一下:

    npm install make -g
    gem install http_parser.rb -v '0.6.0'
    bundle install

    终于过去了,忍不住骂一句:瓦特的法克

  • kimwang 8月前
    引用 10
    其实想建议弃坑,BS太粗大了,就像Zend  Framework一样,而且BS对比现在的很多前端框架已经不算惊艳。
  • 真帅 8月前
    引用 11
    非常建议扔掉Bootstrap  ,自己原创UI,方为王道
  • 风刀 8月前
    引用 12
    看到后端在搞前端的路上一步一坑的哭爹喊娘最有趣了。。。赶紧出正式版吧,重写一个
  • A-神话 8月前
    引用 13
    前端真不是那么重要,你们可以回想一下谷歌,百度,淘宝,这些有名的网站,在最初的时间页面有多丑,都是边走边完善的。本身xiuno页面都不多,非得搞得那么复杂和臃肿,其实意义并不大。
返回
发新帖