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

Я пытаюсь добавить 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"
  }

person ryegrammer    schedule 27.07.2016    source источник


Ответы (2)


Код, который я написал, следует пошаговым инструкциям на сайте: 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». Однако я все еще не могу заставить загрузчик работать в приложении.

person ryegrammer    schedule 01.08.2016

Вы добавили его в свой файл 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' }
  };
person Bass Jobsen    schedule 31.07.2016
comment
Спасибо за ответ. Я не помещал код в этот файл, но моя ошибка разъясняется в моем ответе. Я посмотрел на него еще раз, когда вы ответили, так что спасибо за ответ, так как я все еще не могу заставить загрузку работать, это может помочь. - person ryegrammer; 01.08.2016