【Angular】Angular项目添加ng-bootstrap插件
来源:互联网 发布:聚类算法分类电子表格 编辑:程序博客网 时间:2024/05/17 11:36
出现的问题
在使用npm
安装ng-bootstrap
插件的过程中,由于GFW,下载外网的依赖包会出现下载不完整的情况
导致如下的错误
npm WARN checkPermissions Missing write access to /usr/lib/node_modules/npm/node_modules/asapnpm WARN checkPermissions Missing write access to /usr/lib/node_modules/npm/node_modules/fstreamnpm WARN checkPermissions Missing write access to /usr/lib/node_modules/npm/node_modules/fstream-npmnpm WARN checkPermissions Missing write access to /usr/lib/node_modules/npm/node_modules/normalize-git-urlnpm WARN checkPermissions Missing write access to /usr/lib/node_modules/npm/node_modules/realize-package-specifier......
通过查询资料和一番摸索过后,才发现原来自己一直都在用npm
,忘了用cnpm
,cnpm
是淘宝定制的淘宝NPM镜像
解决这个问题过后,更加了解了cnpm
带来的好处,当然,它本来可以不用存在的,不随便评价GFW,任何事物都有两面性
这里把出现的问题提供给大家,如果出现了相同的问题,可以试试这个解决方法,如果能解决最好,不能的话,推荐去StackOverflow去搜搜关键词,多半能找到解决方法
安装过程
更改npm的镜像源
npm
的初始源是国外的,速度会有点慢,也会导致依赖包下载不完整而出现各种各样的怎么都搜不到解决方法的问题
这里可以配置淘宝的镜像cnpm
,以后把npm
的指令改为cnpm
即可
npm install -g cnpm --registry=https://registry.npm.taobao.org
如果选了淘宝的cnmp
镜像,应该设置一下,保证正常下载工具
ng set --global packageManager = cnpm
安装ng-bootstrap
进入本地项目目录,然后运行如下命令
cnpm install @ng-bootstrap/ng-bootstrap --save
配置
首先在app.modules.ts
中添加如下代码
import { NgbModule } from "@ng-bootstrap/ng-bootstrap";imports: [ ... , NgbModule.forRoot()],
然后将bootstrap.min.css
文件放入assets/bootstrap/
目录下,并在style.css
文件中添加
@import "assets/bootstrap/bootstrap.min.css";
测试
在app.component.html
中添加如下代码
<button type="button" class="btn btn-success">Press Me Hard</button>
阅读全文
1 0
- 【Angular】Angular项目添加ng-bootstrap插件
- 在 Angular 项目中添加插件 ng-bootstrap
- Angular CLI --添加bootstrap
- angular-bootstrap
- angular.bootstrap
- angular + bootstrap
- 在 Angular 项目中添加 i18n 插件 ngx-translate
- angular拖动插件——ng-drag、ng-drop
- angular 插件angular-hint
- 如何添加bootstrap到Angular工程
- Angular 2 版本的 ng-bootstrap 初体验
- node+webpack+angular+bootstrap创建web项目
- node+webpack+angular+bootstrap创建web项目
- 细说Angular ng-class
- angular--ng-options
- 细说Angular ng-class
- angular的ng-options
- 细说Angular ng-class
- UE4结构体数组之多维数组
- JavaScript中的浅拷贝与深拷贝
- 迭代--文件
- Java数据结构
- Mybatis的一级和二级缓存
- 【Angular】Angular项目添加ng-bootstrap插件
- J2EE开发环境搭建(1)——安装JDK、Tomcat、Eclipse
- Java常用算法——插入排序
- sdafsdfsadf
- Java集合和泛型
- Webstorm 添加新建.vue文件功能并支持高亮vue语法和es6语法
- Hibernate入门(6):CRUD 增删改查
- Helper2416开发板学习②配置/etc文件夹
- 新浪微博JavaSDK开发笔记