Bootstrap4 本地编译运行

step1. 获取bootstrap源代码

  1 https://github.com/twbs/bootstrap

step2. 进入目录并切换npm源

  1  npm --registry https://registry.npm.taobao.org     // 淘宝镜像
  2  npm config get registry    // 查看当前镜像

换源是为了避免天朝防火墙及网速等导致部分资源无法成功下载，例如hugo可能就一直卡住，最后出现问题：

  1 npm err! bootstrap@4.3.1 docs-build: `hugo --cleandestinationdir`

安装完成后，再安装ruby[我安装的是ruby+devkit 2.6.5-1(*64)]，安装ruby的原因是运行scss需要ruby环境~

step3. 安装ruby

下载地址：

右边英文我翻译下：

  1 要下载哪个版本？
  2 如果您不知道要安装哪个版本，并且开始使用ruby，建议您使用ruby + devkit 2.6.x（x64）安装程序。它提供了最多数量的兼容gem，并与ruby一起安装了msys2-devkit，因此可以立即编译具有c扩展名的gem。仅当必须使用自定义32位本机dll或com对象时，才建议使用32位（x86）版本。

然后安装：

不要问我下面那个895m的要不要勾，也不要去百度勾不勾，勾就完事了，反正公司电脑内存大~，不选可能导致以后少这少那的 ，又不能保证以后会不会出现缺少包等问题，出了问题又得去百度，百度又不一定能很快找到答案，就是勾

安装ruby后，会出现一个黑窗：

继续翻译下：

  1 which components shall be installed? if unsure press enter []
  2 应安装哪些组件？如果不确定，请按enter[]

个人建议继续按回车，反正公司电脑内存大~，不选可能导致以后少这少那的

然后可以摸会鱼，需要点时间 ，安装完成后也会出现这行提示，回车就正式安装完成了，黑窗口自动关闭

 

step4. 进入项目目录安装捆绑机

  1 gem install bundler
  2 bundle install

这个我也不知道为什么要安装，文档上这么写的:  

然后运行到一半就挂了 ，此时原因是防火墙~，

出错：(找不到gemfile文件)

  1 could not locate gemfile

解决：(重新生成一个gemfile文件)

  1 bundle -h
  2 bundle init

 

step5. ok

此时可以运行package.json里的各种命令了 ，先试下github bootstrap第二个命令【测试】，试下能不能正常运行：

  1 npm run test

此时一片代码哗啦啦的往上飘

运行结果：

java is missing是不是似曾相识 ，我继续翻译下：

  1 正在跳过vnu jar测试；缺少java。
  2 在4.708秒内成功扫描了481个链接。

缺少java环境，还是老老实实敲代码吧~

  1 npm start     // 这次摸着良心和你说绝对有用！

ok了，现在可以在编译运行敲代码了， //  看着我的表情~

先在\scss\_nav.scss试试：将paddind-left改成9990px，然后保存

接着下面又是一片代码飘过~，然后去dist/css/bootstrap.css里面看下有没有变化：(记得ctrl+f查找nav)

完成，搞定~  (这表情绝对绝对没恶意，，)

 

.