CODEWITHSUNDEEP
node.jsangular
Waterbed
Waterbed

Reputation: 11

AngularJS 2 : Run (very) basic application

I'm trying to run first basic example of AngularJS 2 But when I try to run the application (npm start within my folder project) I've got following error message:

[email protected] start /home/waterbed/xxxy
tsc && concurrently "npm run tsc:w" "npm run lite"

app/app.component.ts(3,10): error TS2305: Module '"/home/waterbed/xxxy/app/app.component"' has no exported member 'AppComponent'.
app/main.ts(2,27): error TS2307: Cannot find module './app.module'.

npm ERR! Linux 3.16.0-4-586
npm ERR! argv "/usr/local/bin/node" "/usr/local/bin/npm" "start"
npm ERR! node v4.4.5
npm ERR! npm  v2.15.5
npm ERR! code ELIFECYCLE
npm ERR! [email protected] start: `tsc && concurrently "npm run tsc:w" "npm run lite" `
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the [email protected] start script 'tsc && concurrently "npm run tsc:w" "npm run lite" '.
npm ERR! This is most likely a problem with the angular2-quickstart package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     tsc && concurrently "npm run tsc:w" "npm run lite"
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs angular2-quickstart
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!
npm ERR!     npm owner ls angular2-quickstart
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /home/waterbed/xxxy/npm-debug.log

Error, message seems to be quite obvious, but google's guide never mentioned to create app.module.

tree ./app returns:

app/
├── app.component.js
├── app.component.js.map
├── app.component.ts
├── app.modules.js
├── app.modules.js.map
├── app.modules.ts
├── main.js
├── main.js.map
└── main.ts

Not to mention that I'm new to AngularJS, whatever the version we're talking about, I'm almost new to npm, nodejs, ...

Upvotes: 1

Views: 291

Answers (3)

Waterbed
Waterbed

Reputation: 11

So as Coding Mon key indicates app.module.ts wasn't correctly named. But I also had to do the following:

  1. rm -rf node_modules
    • npm install
    • npm run typings install
  2. copy again contain of follsoing files from Angular JS quickstart:
  3. app/main.ts import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; import { AppModule } from './app.module'; const platform = platformBrowserDynamic(); platform.bootstrapModule(AppModule);
  4. app/app.module.ts import { NgModule } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; import { AppComponent } from './app.component'; @NgModule({ imports: [ BrowserModule ], declarations: [ AppComponent ], bootstrap: [ AppComponent ] }) export class AppModule { }
  5. app/app.component.ts import { Component } from '@angular/core'; @Component({ selector: 'my-app', template: '

    My First Angular App

    ' }) export class AppComponent { }

Upvotes: 0

Coding Monkey
Coding Monkey

Reputation: 28

Your app.component.ts is looking for app.module.ts, but you don't have that file in your file structure. Try renaming 

app.modules.ts

to

app.module.ts

Upvotes: 0

Mr. Binary
Mr. Binary

Reputation: 81

First look at your app.component and if AppComponent class is not exported put export before class keyword. Also check if your files have same code as angular2 sample app. Maybe you forgot something.

Try updating your version of npm (node package manager).
npm update
or
npm update -g

Upvotes: 1

Related Questions