[英]error TS2304: Cannot find name 'NGB_PRECOMPILE' when adding ng-bootstrap to Angular2 quick start for TypeScript
I am trying to add ng-bootstrap to Angular2's quick start for TypeScript by following the instructions at https://ng-bootstrap.github.io/#/getting-started . 我正在尝试按照https://ng-bootstrap.github.io/#/getting-started上的说明将ng-bootstrap添加到Angular2的TypeScript快速入门中。 When I do npm start it gives me the error TS2304 cannot find name 'NGB_PRECOMPILE'.
当我执行npm启动时,它给我错误TS2304找不到名称“ NGB_PRECOMPILE”。
app.component.ts 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);
and dependencies in package.son 和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"
}
The code I wrote follows the step-by-step instructions on the site: https://github.com/ng-bootstrap/ng-bootstrap . 我编写的代码遵循网站上的分步说明: https : //github.com/ng-bootstrap/ng-bootstrap 。 However, the section listed at the bottom shows what the component should look like as a whole and it lists both NGB_DIRECTIVES and NGB_PRECOMPILE in the import where the step-by-step instructions do not.
但是,底部列出的部分显示了该组件的整体外观,并且在导入中列出了NGB_DIRECTIVES和NGB_PRECOMPILE,而分步说明中没有。 This was my mistake of not having read the code entirely.
这是我没有完全阅读代码的错误。
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 {
...
}
This fixes the error TS2304 cannot find name 'NGB_PRECOMPILE'. 这修复了错误TS2304找不到名称“ NGB_PRECOMPILE”。 However, I still cannot get bootstrap working in the application.
但是,我仍然无法在应用程序中启动引导程序。
Did you add it to your systemjs.config.js
file? 您是否将其添加到
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' }
};
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.