ошибка TS2304: не удается найти имя «NGB_PRECOMPILE» при добавлении ng-bootstrap в быстрый запуск Angular2 для TypeScript

Question

Я пытаюсь добавить ng-bootstrap в быстрый запуск Angular2 для TypeScript, следуя инструкциям на https://ng-bootstrap.github.io/#/getting-started. Когда я запускаю npm, он дает мне ошибку TS2304 не может найти имя «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" 
    } 

Answer 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». Тем не менее, я все еще не могу получить загрузочную загрузку в приложении.

Answer 2

ли вы добавить его в свой файл 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' } 
    };