2016-07-27 59 views
0

我正在尝试按照https://ng-bootstrap.github.io/#/getting-started上的说明将ng-bootstrap添加到Angular2的TypeScript快速入门中。当我做npm启动时,它给了我错误TS2304找不到名称'NGB_PRECOMPILE'。错误TS2304:将ng-bootstrap添加到TypeScript的Angular2快速入门时找不到名称'NGB_PRECOMPILE'

app.component.ts

import { Component } from '@angular/core'; 
import {NGB_DIRECTIVES} from '@ng-bootstrap/ng-bootstrap'; 
import { TasksComponent } from './tasks.component' 

@Component({ 
    selector: 'my-app', 
    directives: [ TasksComponent, NGB_DIRECTIVES ], 
    precompile: [ NGB_PRECOMPILE ], 
    template: `<h1 class="header">{{title}}</h1> 
     <tasks></tasks>`, 
    styles: [` 
     .header { 
      background: #999999; 
      border: 2px solid #444444; 
     } 
    `] 
}) 
export class AppComponent { 
    title = 'To Do List - Alaska'; 
} 

main.ts

import { bootstrap } from '@angular/platform-browser-dynamic'; 
import { AppComponent } from './app.component'; 
bootstrap(AppComponent); 

和依赖于package.son

"dependencies": { 
    "@angular/common": "2.0.0-rc.4", 
    "@angular/compiler": "2.0.0-rc.4", 
    "@angular/core": "2.0.0-rc.4", 
    "@angular/forms": "0.2.0", 
    "@angular/http": "2.0.0-rc.4", 
    "@angular/platform-browser": "2.0.0-rc.4", 
    "@angular/platform-browser-dynamic": "2.0.0-rc.4", 
    "@angular/router": "3.0.0-beta.2", 
    "@angular/router-deprecated": "2.0.0-rc.2", 
    "@angular/upgrade": "2.0.0-rc.4", 
    "@ng-bootstrap/ng-bootstrap": "^1.0.0-alpha.0", 
    "angular2-in-memory-web-api": "0.0.14", 
    "bootstrap": "^3.3.6", 
    "core-js": "^2.4.0", 
    "reflect-metadata": "^0.1.3", 
    "rxjs": "5.0.0-beta.6", 
    "systemjs": "0.19.27", 
    "zone.js": "^0.6.12" 
    }, 
    "devDependencies": { 
    "concurrently": "^2.0.0", 
    "lite-server": "^2.2.0", 
    "typescript": "^1.8.10", 
    "typings": "^1.0.4", 
    "canonical-path": "0.0.2", 
    "http-server": "^0.9.0", 
    "tslint": "^3.7.4", 
    "lodash": "^4.11.1", 
    "jasmine-core": "~2.4.1", 
    "karma": "^0.13.22", 
    "karma-chrome-launcher": "^0.2.3", 
    "karma-cli": "^0.1.2", 
    "karma-htmlfile-reporter": "^0.2.2", 
    "karma-jasmine": "^0.3.8", 
    "protractor": "^3.3.0", 
    "rimraf": "^2.5.2" 
    } 

回答

1

我写的代码如下网站上的一步一步的指示:https://github.com/ng-bootstrap/ng-bootstrap。但是,底部列出的部分显示了组件的整体外观,并且在导入中列出了NGB_DIRECTIVES和NGB_PRECOMPILE,而分步说明却没有。这是我没有完全阅读代码的错误。

import {Component} from '@angular/core'; 
import {NGB_DIRECTIVES, NGB_PRECOMPILE} from '@ng-bootstrap/ng-bootstrap'; 

@Component({ 
    selector: 'app', 
    directives: [ NGB_DIRECTIVES ], 
    precompile: [ NGB_PRECOMPILE ], 
    templateUrl: './app.html', 
}) 
export class App { 
    ... 
} 

修复了错误TS2304找不到名称'NGB_PRECOMPILE'。但是,我仍然无法在应用程序中获得引导程序。

0

你将它添加到您的systemjs.config.js文件?

//map tells the System loader where to look for things 
    var map = { 
    ... 
    '@ng-bootstrap/ng-bootstrap': 'node_modules/@ng-bootstrap/ng-bootstrap' 
}; 

    //packages tells the System loader how to load when no filename and/or no extension 
    var packages = { 
...  
'@ng-bootstrap/ng-bootstrap': { defaultExtension: 'js', main: 'index.js' } 
    }; 
+1

感谢您的回复。我没有把代码放到那个文件中,但是我的错误在我的答案中得到了澄清。当你回应时,我再次看着它,所以谢谢你的回应,因为我仍然无法获得bootstrap的工作,这可能会有所帮助。 – ryegrammer

相关问题