gulp elixir-typescript无法编译

时间:2016-08-11 13:17:14

标签: laravel angular typescript gulp laravel-elixir

我试图在laravel 5.2中使用Angular2,所以我试图配置gulp来编译typescript文件。

这是我的package.json文件:

{
  "private": true,
  "scripts": {
    "prod": "gulp --production",
    "dev": "gulp watch"
  },
  "devDependencies": {
    "gulp": "^3.9.1",
    "laravel-elixir": "^5.0.0",
    "bootstrap-sass": "^3.0.0",
    "@angular/common": "2.0.0-rc.5",
    "@angular/compiler": "2.0.0-rc.5",
    "@angular/core": "2.0.0-rc.5",
    "@angular/forms": "0.3.0",
    "@angular/http": "2.0.0-rc.5",
    "@angular/platform-browser": "2.0.0-rc.5",
    "@angular/platform-browser-dynamic": "2.0.0-rc.5",
    "@angular/router": "3.0.0-rc.1",
    "@angular/router-deprecated": "2.0.0-rc.2",
    "@angular/upgrade": "2.0.0-rc.5",
    "systemjs": "0.19.27",
    "core-js": "^2.4.0",
    "reflect-metadata": "^0.1.3",
    "rxjs": "5.0.0-beta.6",
    "zone.js": "^0.6.12"
  },
  "dependencies": {
    "elixir-typescript": "^2.0.0"
  }
}

这是我的tsconfig.json(我放入资源/资产/打字稿):

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false
  },
  "exclude": [
    "node_modules"
  ]
}

最后我有我的gulpfile.js:

var elixir = require('laravel-elixir');
var elixirTypscript = require('elixir-typescript');

elixir(function(mix) {
    mix.sass('app.scss');

    mix.typescript('main.ts', 'public/js/');

    mix.copy('node_modules/@angular', 'public/js/angular');
    mix.copy('node_modules/when/es6-shim', 'public/js/es6-shim');
    mix.copy('node_modules/es6-promise', 'public/js/es6-promise');
    mix.copy('node_modules/rxjs', 'public/js/rxjs');
    mix.copy('node_modules/systemjs', 'public/js/systemjs');
    mix.copy('node_modules/zone.js', 'public/js/zone.js');

});

当我从控制台开始gulp时,我会遇到很多错误,例如:

/var/www/chat/laravel/node_modules/@angular/common/src/directives/ng_class.d.ts(81,34): error TS2304: Cannot find name 'Set'.
[14:59:24] gulp-notify: [Laravel Elixir] TypeScript Compilation Failed!: /var/www/chat/laravel/node_modules/@angular/common/src/directives/ng_class.d.ts(81,34): error TS2304: Cannot find name 'Set'.
{ [TypeScript error: /var/www/chat/laravel/node_modules/@angular/common/src/directives/ng_class.d.ts(81,34): error TS2304: Cannot find name 'Set'.]
  name: 'TypeScript error',
.....

它似乎尝试编译node_modules中的所有打字稿内容。我使用了字段"排除"在tsconfig.json中但它似乎没有用。

1 个答案:

答案 0 :(得分:0)

我有同样的问题但在这里修好了。

https://github.com/axiskafi/angular2-laravel5

你的package.json和gulp文件需要一些修改。按照给定的链接和说明,它将解决您的问题。