模块"AppModule"导入的异常值"MyCustomModule" [英] Unexpected value 'MyCustomModule' imported by the module 'AppModule'

问题描述

我正在尝试将我的angular2自定义库之一迁移到RC.6 + Webpack.我的目录结构是:

I am trying to migrate one of my angular2 custom library to RC.6 + Webpack. My directory structure is:

- src - source TS files
- lib - transpiled JS files + definition files
- dev - development app to test if it works / looks ok.
- myCustomLib.js - barrel
- myCustomLib.d.ts

在dev文件夹中，尝试运行应用程序.我引导了我的模块:

Within dev folder try to run an app. I bootstrap my module:

app.module.ts

import { BrowserModule }                from "@angular/platform-browser";
import { NgModule }                     from "@angular/core";
import { AppComponent }                 from "./app.component";
import { MyCustomModule }               from "../../myCustomLib";

@NgModule({
    imports: [
        BrowserModule,
        MyCustomModule
    ],
    declarations: [ AppComponent ],
    bootstrap: [ AppComponent ]
})
export class AppModule {
}

现在使用Webpack捆绑我的开发应用程序.

Now using the webpack I bundle my dev app.

webpack.config.js

module.exports = {
    entry: "./app/boot",
    output: {
        path: __dirname,
        filename: "./bundle.js",
    },
    resolve: {
        extensions: ['', '.js', '.ts'],
        modules: [
            'node_modules'
        ]
    },
    devtool: 'source-map',
    module: {
        loaders: [{
            test: /\.js$/,
            loader: 'babel-loader',
            exclude: /node_modules/
        }, {
            test: /\.ts$/,
            loader: 'awesome-typescript-loader',
            exclude: /node_modules/
        }]
    },
    watch: true
};

但是当我尝试加载应用程序时，我收到一条消息:

But when I try to load the app I get a message:

metadata_resolver.js:230
Uncaught Error: Unexpected value 'MyCustomModule' imported by the module 'AppModule'

我导入的桶文件如下:

myCustomLib.js

export * from './lib/myCustomLib.module';

我还发现了在github上类似主题的提示，但将其更改为:

I found also hint on similar topic on github, but changing it to:

export { MyCustomModule } from './lib/myCustomLib.module';

没有帮助.我也尝试过从src目录导入模块-同样的错误. MyCustomModule应该可以，因为它以前可以与systemJS一起正常工作.

did not help. I have also tried to import the module from src directory - same error. MyCustomModule should be ok as It was working fine with systemJS before.

myCustomLib.module.ts:

import { NgModule }                     from '@angular/core';
import { BrowserModule }                from '@angular/platform-browser';

@NgModule({
    imports: [
        BrowserModule
    ]
})
export class MyCustomModule {}

任何想法都可能是导致此错误的原因吗?我在这里看到过类似的话题，但没有任何答案或提示帮助.

Any idea what can be the reason of this error? I have seen similar topics here but no answer or hint helped.

编辑:为了简化示例，我从MyCustomModule中删除了所有内容-相同的问题...

Edit: To make the example even simpler I have removed all from MyCustomModule - same problem...

推荐答案

将lib文件夹添加到您的用于解析模块的webpack配置.该路径应相对于webpack配置文件的位置.

Add the lib folder to your webpack configuration for resolving modules.The path should be relative to the location of the webpack config file.

resolve: {
   modules: ['node_modules','lib']

这篇关于模块"AppModule"导入的异常值"MyCustomModule"的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！