标签：npm lite bootstrap js 引入 install bootstrap4

bootstrap应用场景

①实现定义好的可复用CSS组件。
②用户使用的终端设备不一样，可以实现accessible。
③解决browers的兼容问题。

bootstrap和react的区别

bootstrap只是基于html的UI布局工具，设计响应式页面。
react是组件工程化。

安装与引入

安装方法

进入路径，然后用npm install
装完之后添加.gitignore忽略node_modules

download bootstrap

指令:npm install bootstrap@4.0.0 --save
接下来安装它的同伙：jQuery和Popper.js
npm install jquery@3.3.1 popper.js@1.12.9 --save

查看文件

进入node_modules，有个bootstrap，接着进入dist，进入css文件夹。
这里要用到bootstrap.min.css

用lite-server启动

给json表加东西

"scripts":{
	"start":"npm run lite",
	"test": "echo \ "Error: no test specified\" && exit 1",
	"lite":"lite-server"
}

cmd里使用npm start

给主页加上引用表

CSS部分：

<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.min.css">

注意引入bootstrap的js要先引入jquery和popper

<script src="node_modules/jquery/dist/jquery.slim.min.js"></script>
<script src="node_modules/popper.js/dist/umd/popper.min.js"></script>
<script src="node_modules/bootstrap/dist/js/bootstrap.min.js"></script>

标签：npm,lite,bootstrap,js,引入,install,bootstrap4
来源： https://www.cnblogs.com/rosecanoe/p/15169123.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。