Bootstrap4 本地编译运行
Step1. 获取Bootstrap源代码
https://github.com/twbs/bootstrap
Step2. 进入目录并切换npm源
npm --registry https://registry.npm.taobao.org // 淘宝镜像
npm config get registry // 查看当前镜像
换源是为了避免天朝防火墙及网速等导致部分资源无法成功下载,例如hugo可能就一直卡住,最后出现问题:
npm ERR! bootstrap@4.3.1 docs-build: `hugo --cleanDestinationDir`
安装完成后,再安装Ruby[我安装的是Ruby+Devkit 2.6.5-1(*64)],安装Ruby的原因是运行scss需要Ruby环境~
Step3. 安装Ruby
下载地址:https://rubyinstaller.org/downloads/
右边英文我翻译下:
要下载哪个版本?
如果您不知道要安装哪个版本,并且开始使用Ruby,建议您使用Ruby + Devkit 2.6.X(x64)安装程序。它提供了最多数量的兼容gem,并与Ruby一起安装了MSYS2-Devkit,因此可以立即编译具有C扩展名的gem。仅当必须使用自定义32位本机DLL或COM对象时,才建议使用32位(x86)版本。

然后安装:

不要问我下面那个895M的要不要勾,也不要去百度勾不勾,勾就完事了,反正公司电脑内存大~,不选可能导致以后少这少那的  ,又不能保证以后会不会出现缺少包等问题,出了问题又得去百度,百度又不一定能很快找到答案,就是勾
,又不能保证以后会不会出现缺少包等问题,出了问题又得去百度,百度又不一定能很快找到答案,就是勾 
安装Ruby后,会出现一个黑窗:
继续翻译下:
Which components shall be installed? If unsure press ENTER []
应安装哪些组件?如果不确定,请按ENTER[]
个人建议继续按回车,反正公司电脑内存大~,不选可能导致以后少这少那的 
然后可以摸会鱼,需要点时间  ,安装完成后也会出现这行提示,回车就正式安装完成了,黑窗口自动关闭
,安装完成后也会出现这行提示,回车就正式安装完成了,黑窗口自动关闭

Step4. 进入项目目录安装捆绑机
gem install bundler
bundle install
这个我也不知道为什么要安装,文档上这么写的: https://www.php.cn/manual/view/34065.html 

然后运行到一半就挂了  ,此时原因是防火墙~,
,此时原因是防火墙~,
出错:(找不到Gemfile文件)
Could not locate Gemfile
解决:(重新生成一个Gemfile文件)
bundle -h
bundle init
Step5. OK
此时可以运行package.json里的各种命令了  ,先试下github bootstrap第二个命令【测试】,试下能不能正常运行:
 ,先试下github bootstrap第二个命令【测试】,试下能不能正常运行:
npm run test

此时一片代码哗啦啦的往上飘 
运行结果:

Java is missing是不是似曾相识  ,我继续翻译下:
,我继续翻译下:
正在跳过vnu jar测试;缺少Java。
在4.708秒内成功扫描了481个链接。
缺少Java环境,还是老老实实敲代码吧~
npm start // 这次摸着良心和你说绝对有用!

ok了,现在可以在编译运行敲代码了, //   看着我的表情~
 看着我的表情~
先在\scss\_nav.scss试试:将paddind-left改成9990px,然后保存

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

完成,搞定~   (这表情绝对绝对没恶意,,)
 (这表情绝对绝对没恶意,,)
.
Bootstrap4 本地编译运行的更多相关文章
- Saiku本地编译运行后Debug调试(十二)
		Saiku源码拉下来在本地编译通过,然后想进行单元测试 发现不知道怎么写测试类了... 幸好有同事大佬的帮助,教了一招哈哈哈哈... 1.将本地编译通过的Saiku打包好(mvn clean inst ... 
- 【git】Github上面的开源代码怎么在本地编译运行
		最近才发现Github是一个好东西,可以从上面学到很多东西,不说了,赶快写完去学习去... 1.首先你可以看看这个开源项目的README.md,一般一般这里都会有项目的使用方式以及一些注意的点 2.你 ... 
- EditPlus远程编辑、语法高亮、编译运行源代码设置
		最近写代码的过程中,除了写Java时用的Eclipse.在Linux下编辑的Vi之外,有时也会用EditPlus打开一些文件,如配置文件.日志文件.脚本等.个人觉得EditPlus在很多场景下比较好用 ... 
- Form_Form Builder本地部署运行的实现(案例)
		2014-08-09 Created By BaoXinjian 
- 使用Eclipse编译运行MapReduce程序 Hadoop2.6.0_Ubuntu/CentOS
		使用Eclipse编译运行MapReduce程序 Hadoop2.6.0_Ubuntu/CentOS 2014-10-10 (updated: 2016-05-22) 64246 153 本教程介绍 ... 
- 《Flink 源码解析》—— 源码编译运行
		更新一篇知识星球里面的源码分析文章,去年写的,周末自己录了个视频,大家看下效果好吗?如果好的话,后面补录发在知识星球里面的其他源码解析文章. 前言 之前自己本地 clone 了 Flink 的源码,编 ... 
- JAVA 基础开发环境 vscode 搭建 Windows下VSCode编译运行简单java
		JAVA 基础开发环境 vscode 搭建 来源 https://www.cnblogs.com/freewsf/p/7744728.html 对于使用 Visual Studio Code 的 Ja ... 
- 1   开发一个注重性能的JDBC应用程序不是一件容易的事. 当你的代码运行很慢的时候JDBC驱动程序并不会抛出异常告诉你。    本系列的性能提示将为改善JDBC应用程序的性能介绍一些基本的指导原则,这其中的原则已经被许多现有的JDBC应用程序编译运行并验证过。 这些指导原则包括:     正确的使用数据库MetaData方法     只获取需要的数据     选用最佳性能的功能     管理连
		1 开发一个注重性能的JDBC应用程序不是一件容易的事. 当你的代码运行很慢的时候JDBC驱动程序并不会抛出异常告诉你. 本系列的性能提示将为改善JDBC应用程序的性能介绍一些基本的指导原则,这其中的 ... 
- Flink 源码解析 —— 源码编译运行
		更新一篇知识星球里面的源码分析文章,去年写的,周末自己录了个视频,大家看下效果好吗?如果好的话,后面补录发在知识星球里面的其他源码解析文章. 前言 之前自己本地 clone 了 Flink 的源码,编 ... 
随机推荐
- mq解决分布式事物问题
			今天只看看原理,下一节看项目怎么集成mq进行解决分布式事物. 1.什么情况下会使用到分布式事物? 举例说明:现有一个支付系统,因为项目使用的是微服务框架,有订单模块和支付模块两个模块.生产者进行订单的 ... 
- luogu P2860 [USACO06JAN]冗余路径Redundant Paths |Tarjan
			题目描述 In order to get from one of the F (1 <= F <= 5,000) grazing fields (which are numbered 1. ... 
- BOM对象学习
			location,history,screen <!DOCTYPE html> <html> <head> <meta charset="utf-8 ... 
- Asp.net MVC + AngularJS 统一权限管理系统(一)
			背景: 之前公司内部做了不少系统,但是权限管理都是分开的:一直都想能够有一套统一管理的权限管理系统:有的时间都是一直在计划,随着时间的流逝,计划始终没有实现,也随着项目的增多而这权限管理也变得版本多样 ... 
- SPOJ- Distinct Substrings(后缀数组&后缀自动机)
			Given a string, we need to find the total number of its distinct substrings. Input T- number of test ... 
- BZOJ2809 dispatching(左偏树)
			在一个忍者的帮派里,一些忍者们被选中派遣给顾客,然后依据自己的工作获取报偿.在这个帮派里,有一名忍者被称之为 Master.除了 Master以外,每名忍者都有且仅有一个上级.为保密,同时增强忍者们的 ... 
- Python3 面向对象小练习
			定义MySQL类 对象有id.host.port三个属性 定义工具create_id,在实例化时为每个对象随机生成id,保证id唯一 提供两种实例化方式,方式一:用户传入host和port 方式二:从 ... 
- 不启动AndroidStudio直接启动其模拟器
			1.找到自己电脑Android sdk的安装路径下的tools\emulator.exe 2.获取你要启动的模拟器的名称 我这里是Nexus 5X API 27,把名字中间的空格改为_,我这里就应该改 ... 
- Callable接口实现线程
			public class CallableDemo { public static void main(String[] args) throws Exception, ExecutionExcept ... 
- 通过Redis 实现分布式锁_利用Jedis 客户端
			前言 分布式锁一般有三种实现方式: 数据库乐观锁:2. 基于Redis的分布式锁:3. 基于ZooKeeper的分布式锁. 本篇博客将介绍第二种方式,基于Redis实现分布式锁. 虽然网上已经有各种介 ... 
