How to use ng2-bootstrap in angular2-meteor1.3 project?

Question

For a new project, I have run those in terminal

npm init

meteor add angular2-compilers

meteor remove blaze-html-templates

meteor npm install --save angular2-meteor

meteor npm install --save meteor-node-stubs

meteor npm install --save bootstrap4-webpack-package

meteor npm install --save ng2-bootstrap

import 'reflect-metadata';
import 'zone.js/dist/zone';
import 'bootstrap4-webpack-package';
import { Component } from 'angular2/core';
import { bootstrap } from 'angular2/platform/browser';
import { Alert } from 'ng2-bootstrap/ng2-bootstrap';

@Component({
  selector: 'app',
  template: `<alert type="info">ng2-bootstrap hello world!</alert>`,
  directives: [Alert]
})
class App { }
bootstrap(App);

Right now bootstrap4-webpack-package makes Bootstrap 4 works, but ng2-bootstrap still not works.

Since I am using Bootstrap 4, so I also tried to add

import { Ng2BootstrapConfig, Ng2BootstrapTheme } from 'ng2-bootstrap/ng2-bootstrap';
Ng2BootstrapConfig.theme = Ng2BootstrapTheme.BS4;

But still not works.

It shows the error:

EXCEPTION: No Directive annotation found on Alert

EXCEPTION: Error: Uncaught (in promise): No Directive annotation found on Alert

I am not sure whether this is related with this issue .

How can I use ng2-bootstrap? Thanks

Answer 1

At last I found it is because of my NPM problem. Because the code can run well on other people's machine.

I uninstall my NPM, and install the new v5.10.1, the problem fixes!

Check here for details.

Hope this can help people who met similar weird problem.