Unexpected value 'SamplePipe' declared by the module 'AppModule'

[AhsanAyaz]

When working on new Angular2.0 project (check project's package.json), it gives the error:

Unexpected value 'SamplePipe' declared by the module 'AppModule'

Project's dependencies:

"dependencies": {
    "@angular/common": "2.0.0",
    "@angular/compiler": "2.0.0",
    "@angular/core": "2.0.0",
    "@angular/forms": "2.0.0",
    "@angular/http": "2.0.0",
    "@angular/platform-browser": "2.0.0",
    "@angular/platform-browser-dynamic": "2.0.0",
    "@angular/router": "3.0.0",
    "core-js": "^2.4.1",
    "rxjs": "5.0.0-beta.12",
    "ts-helpers": "^1.1.1",
    "zone.js": "^0.6.23"
  },
  "devDependencies": {
    "@types/jasmine": "^2.2.30",
    "angular-cli": "1.0.0-beta.15",
    "codelyzer": "~0.0.26",
    "jasmine-core": "2.4.1",
    "jasmine-spec-reporter": "2.5.0",
    "karma": "1.2.0",
    "karma-chrome-launcher": "^2.0.0",
    "karma-cli": "^1.0.1",
    "karma-jasmine": "^1.0.2",
    "karma-remap-istanbul": "^0.2.1",
    "protractor": "4.0.5",
    "ts-node": "1.2.1",
    "tslint": "3.13.0",
    "typescript": "2.0.2"
  }

App Module's code:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';

import { AppComponent } from './app.component';
import { PROVIDERS, PIPES } from 'new-library';
@NgModule({
  declarations: [
    AppComponent,
    PIPES
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule
  ],
  providers: [PROVIDERS],
  bootstrap: [AppComponent]
})
export class AppModule { }

I didn't change anything in the files that were generated using the generators. Just used "npm link" to register locally, and then linked to the test project to test the library in development environment.

[dolanmiu]

Im having the same issue with npm link

edit: i just published my module to npm, and it still doesn't work...

https://www.npmjs.com/package/ng2-mouse-icon

[jvandemo]

This seems to be an issue related to Webpack.

Angular CLI

If you use an Angular CLI generated project, you can resolve this manually by editing angular-cli/models/webpack-build-common.ts in your node_modules directory and adding the following line under the extensions key:

modules: [path.resolve(projectRoot, 'node_modules')]

You can read more details here. There seems to be a fix in the Angular CLI repository so a recent version of Angular CLI will probably fix this automatically.

Angular 2 Webpack Starter

If you are using Angular 2 Webpack Starter (instead of an Anguler CLI project) you can resolve it by changing:

modules: [helpers.root('src'), 'node_modules'] 

to:

modules: [helpers.root('src'), helpers.root('node_modules')]

in your Webpack configuration file.

You can read more details here.

Can you try and see if this works for you? Thanks!

[sachanacar]

Hi all,

Any idea how someone not using webpack (and using SystemJS instead) can solve that issue?

Cheers!
Sacha

[jvandemo]

@sachanacar — Have you found a solution yet for SystemJS? Thanks!

[jvandemo]

Version 8.1.0 of this generator has been released, aligning with the latest Angular Package Format, which should solve this issue.

Feel free to re-open and report back if you experience issues with v8.1.0.

Thanks again for your great feedback! 👍

[william-lohan]

I have an issue with "Unexpected value 'SampleModule' imported by the module 'AppModule'"(got here from #22) with version 11.1.0.