Grunt Typescript can't find angular core

2019-03-28 11:14发布

问题:

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

回答1:

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']);
};