Question

我正在使用使用Webpack（https://visualstudiogallery.msdn.microsoft.com/31a3eab5-e62b-4030-9226-b5e4c9e1ffb5）的ASP.NET核心模板。

我正在尝试将一堆外部模块导入到我的Angular 2项目中。 https://www.npmjs.com/package/ng2-slider-component就是其中之一。

打开＆＃34; ng2-slider-component＆＃34;在我的node_modules文件夹中，我看到以下文件：

NG2-slider.component.d.ts
NG2-slider.component.html
NG2-slider.component.js
ng2-slider.component.js.map
NG2-slider.component.system.js

我遗漏了像＆＃34; ng2-slider.component.ts＆＃34;我可以在我的＆＃34; app.module.ts＆＃34;中导入。所以我试图这样做，如下所示。

import { Ng2SliderComponent } from 'ng2-slider-component/ng2-slider.component';

然后在我的@NgModule中使用它。

@NgModule({
bootstrap: [ AppComponent ],
declarations: [
    Ng2SliderComponent
]})

但是这会引发内部服务器错误：异常：调用节点模块失败并显示错误：错误：moduleId应该是＆＃34; Ng2SliderComponent＆＃34;中的字符串。有关更多信息，请参阅如果您正在使用Webpack，则应该内联模板和样式。

Answer 1

您需要将以下代码添加到 systemjs.config.js （如果您使用的是系统加载程序），

packages: {

    ....

    'node_modules/ng2-slider-component': {
            main: 'ng2-slider.component.system.js',
            defaultExtension: 'system.js' 
    },

    .... 

}

导入外部Angular 2组件失败

1 个答案: