Uncaught Error: Unexpected value '[object Object]' imported by the module 'AppModule'. Please add a @NgModule annotation.
See original GitHub issue##Bug when linking a recently created library with a vanilla application generated with angular/cli
Stack Trace:
compiler.es5.js:1540 Uncaught Error: Unexpected value ‘[object Object]’ imported by the module ‘AppModule’. Please add a @NgModule annotation. at syntaxError (http://localhost:4200/vendor.bundle.js:5753:34) at http://localhost:4200/vendor.bundle.js:18707:44 at Array.forEach (native) at CompileMetadataResolver.webpackJsonp…/node_modules/@angular/compiler/@angular/compiler.es5.js.CompileMetadataResolver.getNgModuleMetadata (http://localhost:4200/vendor.bundle.js:18690:49) at JitCompiler.webpackJsonp…/node_modules/@angular/compiler/@angular/compiler.es5.js.JitCompiler.loadModules (http://localhost:4200/vendor.bundle.js:29843:66) at JitCompiler.webpackJsonp…/node_modules/@angular/compiler/@angular/compiler.es5.js.JitCompiler.compileModuleAndComponents (http://localhost:4200/vendor.bundle.js:29802:52) at JitCompiler.webpackJsonp…/node_modules/@angular/compiler/@angular/compiler.es5.js.JitCompiler.compileModuleAsync (http://localhost:4200/vendor.bundle.js:29764:23) at PlatformRef.webpackJsonp…/node_modules/@angular/core/@angular/core.es5.js.PlatformRef.bootstrapModuleWithZone (http://localhost:4200/vendor.bundle.js:35662:25) at PlatformRef.webpackJsonp…/node_modules/@angular/core/@angular/core.es5.js.PlatformRef_.bootstrapModule (http://localhost:4200/vendor.bundle.js:35648:21) at Object…/src/main.ts (http://localhost:4200/main.bundle.js:20932:124)
OS: Ubuntu 16.04 x64 Dep Versions: Node - v6.10.2 Npm - 3.3.0 ng-cli - v1.1.0 @ angular/common: 4.1.3 @ angular/compiler: 4.1.3 @ angular/compiler-cli: 4.1.3 @ angular/core: 4.1.3 @ angular/platform-browser: 4.1.3 @ angular/platform-browser-dynamic: 4.1.3
Steps to reproduce:
yo angular2-library
cd <library folder>
npm link src/
cd ..
ng new sample-app
cd sample-app
npm link <library name>
place the folowing code in src/app/app.module.ts
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { SampleModule } from '_<library name>_';
import { AppComponent } from './app.component';
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
SampleModule.forRoot()
],
exports: [
SampleModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
Serve the application and open in browser
Issue Analytics
- State:
- Created 6 years ago
- Comments:19 (3 by maintainers)
I had the same issue, found answer here: https://github.com/angular/angular-cli/wiki/stories-linked-library
You need to edit /src/tsconfig.app.json in your project (not library!) and add:
into compilerOptions object.
This patch works for default ng 2 project (ng new foobar). If project was updated to work with webpack with the following tutorial: https://angular.io/docs/ts/latest/guide/webpack.html webpack.common.js needs be patched. Looks like webpack doesn’t pick up baseUrl and pathes props, so you need to add
Of course make sure that /src/tsconfig.json has baseUrl path paths configured as it was described above.
I agree with @xxxtonixxx , this @angular-cli is nuts. In my package.json “@angular/cli”: “1.0.0” works. but “@angular/cli”: “^1.0.0”, or “@angular/cli”: “1.0.6” fails. It sits in devDependencies so why does it affect runtime?