Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Grunt Typescript can't find angular core

Question

Why cant my Grunt Typescript compiler find the angular core?

I guess it has something to do with the paths so the compiler cant find the libs in the node_modules directory.

Error

typescript/add.component.ts(1,25): error TS2307: Cannot find module 'angular2/core'.

Setup

Gruntfile.js Task

typescript: {
    all: {
        src: ['typescript/**/*.ts'],
        dest: 'javascript/frontend',
        options: {
            target: "es5",
            module: "system",
            moduleResolution: "node",
            emitDecoratorMetadata: true,
            experimentalDecorators: true,
            removeComments: false,
            noImplicitAny: false
        }
}

typescript/add.component.ts

import {Component} from 'angular2/core';

@Component({
    selector: 'mytest',
    template: '<h1>test</h1>'
})
export class AppComponent { }

node_modules

  • Includes angular2
  • Includes typescript

Filepaths

app -- node_modules
    -- typescript
         -- app.component.ts
    -- Gruntfile.js
    -- package.json

Used libs/frameworks/tutorials

  • Grunt Typescript Github
  • Angular2 5min Quickstart
like image 839
NDY Avatar asked Jan 31 '16 12:01

NDY


1 Answers

Just now I had the same exact problem. Running grunt in verbose mode showed the content of the ts config file it generated from the grunt config. Looking more closely, this revealed that the moduleResolution option isn't used at all. But, on the other hand, it wasn't described either on the official grunt-typescript page.

Anyway, long story short: I've used the grunt-ts package instead and everything worked out well! I've posted my config below for your convenience :-)

module.exports = function(grunt) {

  grunt.initConfig({
    ts: {
      base: {
        src: ['src/**/*.ts'],
        dest: 'dist',
        options: {
          module: 'system', 
          moduleResolution: 'node',
          target: 'es5',
          experimentalDecorators: true,
          emitDecoratorMetadata: true,
          noImplicitAny: false
        }
      }
    }
  });

  grunt.loadNpmTasks('grunt-ts');


  grunt.registerTask('default', ['ts']);
};
like image 109
Xabre Avatar answered Oct 15 '22 00:10

Xabre