如何将ng-bootstrap添加到Angular-CLI(Broccoli版本)项目中?

如何将ng-bootstrap(由angular-ui团队编写)添加到Angular-CLI(Angular2 RC4)项目中?

进一步来说:

>我应该如何将我的node_modules文件夹中的缩小.css添加到我的angular-cli项目中?
>我是否必须将其添加到angular-cli-build.js?
>我必须添加打字吗?
>我是否必须将其添加到/src/system-config.ts

解决方法

是的,你必须通过angular-cli-build.js文件中的vendorNpmFiles引用来添加所有的css文件
首先转到项目目录并键入
npm install --save @ng-bootstrap/ng-bootstrap

然后打开你的angular-cli-build.js并添加这一行

vendorNpmFiles: [
  'systemjs/dist/system-polyfills.js','systemjs/dist/system.src.js','zone.js/dist/**/*.+(js|js.map)','es6-shim/es6-shim.js','reflect-Metadata/**/*.+(ts|js|js.map)','rxjs/**/*.+(js|js.map)','@angular/**/*.+(js|js.map)','angularfire2/**/*.js','firebase/*.js','@ng-bootstrap/ng-bootstrap/**/*.+(js|js.map)'
]

现在打开你的src / system-config.ts,写

const map: any = {
  '@ng-bootstrap/ng-bootstrap': 'vendor/@ng-bootstrap/ng-bootstrap'
};

const packages: any = {
  '@ng-bootstrap/ng-bootstrap': {
    defaultExtension: 'js',main: 'index.js'
  },'@ng-bootstrap/ng-bootstrap/accordion': {
    defaultExtension: 'js','@ng-bootstrap/ng-bootstrap/alert': {
    defaultExtension: 'js','@ng-bootstrap/ng-bootstrap/buttons': {
    defaultExtension: 'js','@ng-bootstrap/ng-bootstrap/carousel': {
    defaultExtension: 'js','@ng-bootstrap/ng-bootstrap/collapse': {
    defaultExtension: 'js','@ng-bootstrap/ng-bootstrap/dropdown': {
    defaultExtension: 'js','@ng-bootstrap/ng-bootstrap/pagination': {
    defaultExtension: 'js','@ng-bootstrap/ng-bootstrap/popover': {
    defaultExtension: 'js','@ng-bootstrap/ng-bootstrap/progressbar': {
    defaultExtension: 'js','@ng-bootstrap/ng-bootstrap/rating': {
    defaultExtension: 'js','@ng-bootstrap/ng-bootstrap/tabset': {
    defaultExtension: 'js','@ng-bootstrap/ng-bootstrap/timepicker': {
    defaultExtension: 'js','@ng-bootstrap/ng-bootstrap/tooltip': {
    defaultExtension: 'js','@ng-bootstrap/ng-bootstrap/typeahead': {
    defaultExtension: 'js',main: 'index.js'
  }
};

相关文章

Bootstrip HTML 查询搜索常用格式模版 <form class=&...
如何在按钮上加红色数字 您可以使用Bootstrap的badge组件来在...
要让两个按钮左右排列,你可以使用 Bootstrap 的网格系统将它...
是的,可以将status设置为布尔类型,这样可以在前端使用复选...
前端工程师一般用的是Bootstrap的框架而不是样式,样式一般自...
起步导入:<linkrel="stylesheet"href="b...