Angular2 TypeScript - error TS2307: Cannot find module 'angular2/core'

Question

The version of my TypeScript 1.7.5

My main component file

// import {Component} from 'angular2/core';
import {Component, View} from 'angular2/core';
// import {bootstrap} from 'angular2/platform/browser';

    @Component({
        selector: 'my-app',
        // template: '<h1>My title: {{title}}</h1> <h2>Hardcoded h2</h2>'
    })
    @View({
        templateUrl: '/templates/home.html',
        directives: []
    })
    .Class({
        constructor: function() {

        }
    })

export class AppComponent {
    title = "My First Angular 2 App";
}

My HTML scripts

<!-- 1. Load libraries -->
<script src="node_modules/es6-shim/es6-shim.js"></script>
<script src="node_modules/angular2/bundles/angular2-polyfills.js"></script>
<script src="node_modules/systemjs/dist/system.src.js"></script>
<script src="node_modules/rxjs/bundles/Rx.js"></script>
<script src="node_modules/angular2/bundles/angular2.dev.js"></script>

<script src='app.component.js'></script>
<script src='app/boot.js'></script>

Next when I try to compile the file tsc app.component.ts --module system --experimentalDecorators

I get the following error: app.component.ts(2,31): error TS2307: Cannot find module 'angular2/core'.

Do you know what I'm missing here?

Try adding the template or templateUrl in the @Component annotation instead — Langley
– Langley, Commented Jan 12, 2016 at 15:14
and remove the .Class({ constructor: function() { } }) stuff, that's not from a typescript example is it? your class is: export class AppComponent { title = "My First Angular 2 App"; } — Langley
– Langley, Commented Jan 12, 2016 at 15:15
Ok I removed @View and moved the templateUrl to @Componant, but still when trying to compile it I get Cannot find module 'angular2/core' Also isn't .Class({ contructor: function() the place where I can add logic? Do have have any sample code for a similar basic structure? — Leon Gaban
– Leon Gaban, Commented Jan 12, 2016 at 16:31
like I said your class is export class AppComponent that's where you add your logic, you can set the constructor on it. — Langley
– Langley, Commented Jan 12, 2016 at 16:34

Langley · Accepted Answer · 2016-01-12 17:39:37Z

2

Remove:

.Class({
    constructor: function() {

    }
})

Remove:

@View({
    templateUrl: '/templates/home.html',
    directives: []
})

and put templateUrl: '/templates/home.html', in the @Component annotation instead.

And apply the system.js configuration. In general follow the steps in here:

https://angular.io/

Check the second example.

answered Jan 12, 2016 at 17:39

Langley

5,3442 gold badges29 silver badges42 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Angular2 TypeScript - error TS2307: Cannot find module 'angular2/core'

My main component file

My HTML scripts

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

My main component file

My HTML scripts

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related