得到「找不到模塊'angular2/angular2'」使用gulp-typescript

Question

我想使用Angular 2與TypeScript並使用gulp-typescript編譯爲JavaScript。 但我得到錯誤Cannot find module 'angular2/angular2'.。 然後，我試着改變下面的代碼。

代碼

/// <reference path="../../../node_modules/angular2/core.d.ts" /> 
import {bootstrap, Component} from 'angular2/angular2'; 

@Component({ 
    selector: 'my-app', 
    template: '<h1>My First Angular 2 App</h1>' 
}) 

class AppComponent { } 

bootstrap(AppComponent); 

我得到下面堆棧跟蹤

app/assets/scripts/application.ts(2,36): error TS2307: Cannot find module 'angular2/angular2'. 
/Users/xxxx/app/node_modules/angular2/src/core/application_ref.d.ts(83,60): error TS2304: Cannot find name 'Promise'. 
/Users/xxxx/app/node_modules/angular2/src/core/application_ref.d.ts(83,146): error TS2304: Cannot find name 'Promise'. 
/Users/xxxx/app/node_modules/angular2/src/core/application_ref.d.ts(96,51): error TS2304: Cannot find name 'Promise'. 
/Users/xxxx/app/node_modules/angular2/src/core/application_ref.d.ts(96,147): error TS2304: Cannot find name 'Promise'. 
/Users/xxxx/app/node_modules/angular2/src/core/application_ref.d.ts(133,90): error TS2304: Cannot find name 'Promise'. 
/Users/xxxx/app/node_modules/angular2/src/core/application_ref.d.ts(171,81): error TS2304: Cannot find name 'Promise'. 

以下是咽-打字稿和分型（而不是TSD），tsconfig配置。

// gulpfile.js 

... 
gulp.task('ts', function() { 
    var tsconfig = require('./tsconfig.json'); 

    gulp 
    .src(path.ts) 
    .pipe($.typescript(tsconfig.compilerOptions)) 
    .pipe($.concat('application.js')) 
    .pipe(gulp.dest('dist/assets/')); 
}); 
... 

// typings.json 
{ 
    "dependencies": {}, 
    "devDependencies": {}, 
    "ambientDependencies": { 
    "es6-shim": "github:DefinitelyTyped/DefinitelyTyped/es6-shim/es6-shim.d.ts#6697d6f7dadbf5773cb40ecda35a76027e0783b2" 
    } 
} 

// tsconfig.json 
{ 
    "compilerOptions": { 
    "target"    : "es5", 
    "module"    : "commonjs", 
    "sourceMap"    : false, 
    "emitDecoratorMetadata" : true, 
    "experimentalDecorators": true, 
    "removeComments"  : false, 
    "noImplicitAny"   : false 
    }, 
    "exclude": [ 
    "node_modules" 
    ] 
} 

如何使用gulp-typescript編譯TypeScript以使用Angular 2？

Answer 1

由於模塊加載程序未找到angular2/angular2模塊而導致的錯誤。可能在開發應用程序時，您已經提到了舊教程，其中使用的是alpha版本&您正在使用beta版本進行開發。

按照新的Angular2 beta版本，您應該使用angular2/core模塊而不是angular2/angular2。因爲大部分已經分成不同的模塊。

/// <reference path="../../../node_modules/angular2/core.d.ts" /> 
import { Component } from 'angular2/core'; 
import {bootstrap} from 'angular2/platform/browser'; 

@Component({ 
    selector: 'my-app', 
    template: '<h1>My First Angular 2 App</h1>' 
}) 

class AppComponent { } 

bootstrap(AppComponent); 

另請參閱this answer瞭解更多信息

Plunkr在行動