我已经启动了我的第一个Angular2应用程序,而且我无法使用gulp来编译es5。
以下是依赖项文件:
"dependencies": {
"@angular/common": "2.0.0",
"@angular/compiler": "2.0.0",
"@angular/compiler-cli": "0.6.0",
"@angular/core": "2.0.0",
"@angular/forms": "2.0.0",
"@angular/http": "2.0.0",
"@angular/platform-browser": "2.0.0",
"@angular/platform-browser-dynamic": "2.0.0",
"@angular/router": "3.0.0",
"@angular/upgrade": "2.0.0",
"angular2-in-memory-web-api": "0.0.18",
"bootstrap": "^3.3.6",
"core-js": "^2.4.1",
"gulp": "^3.9.1",
"gulp-htmlmin": "^2.0.0",
"gulp-rename": "^1.2.2",
"jquery": "^2.2.0",
"moment": "^2.14.1",
"ng2-accordion": "0.0.9",
"ng2-bootstrap": "^1.1.5",
"reflect-metadata": "^0.1.3",
"responsive-directives-angular2": "^0.4.2",
"rxjs": "5.0.0-beta.11",
"systemjs": "0.19.27",
"zone.js": "^0.6.17"
},
"devDependencies": {
"@types/core-js": "^0.9.34",
"@types/node": "^6.0.41",
"browser-sync": "^2.16.0",
"canonical-path": "0.0.2",
"chai": "^3.5.0",
"concurrently": "^2.2.0",
"del": "^2.2.2",
"gulp": "^3.9.1",
"gulp-htmlmin": "^2.0.0",
"gulp-rename": "^1.2.2",
"gulp-sass": "^2.3.2",
"gulp-sourcemaps": "^1.6.0",
"gulp-tslint": "^6.1.1",
"gulp-typescript": "^2.14.0",
"http-server": "^0.9.0",
"jasmine-core": "~2.4.1",
"karma": "^1.2.0",
"karma-chai": "^0.1.0",
"karma-chrome-launcher": "^0.2.3",
"karma-cli": "^0.1.2",
"karma-htmlfile-reporter": "^0.2.2",
"karma-jasmine": "^0.3.8",
"karma-mocha": "^1.1.1",
"lite-server": "^2.2.2",
"lodash": "^4.11.1",
"mocha": "^3.0.2",
"node-sass": "^3.10.0",
"raw-loader": "^0.5.1",
"rimraf": "^2.5.2",
"sass-loader": "^4.0.2",
"tslint": "^3.7.4",
"typescript": "^2.0.3",
"typings": "^1.3.2",
"webpack": "^1.13.2",
"webpack-dev-server": "^1.14.1",
"webpack-merge": "^0.14.0"
}
我有以下tsconfig.json
{
"compilerOptions": {
"declaration": false,
"outDir": "dist/app",
"target": "es5",
"mapRoot": "./",
"module": "commonjs",
"moduleResolution": "node",
"sourceMap": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"removeComments": false,
"noImplicitAny": false,
"suppressImplicitAnyIndexErrors": true
},
"exclude": [
"node_modules"
],
"filesGlob": [
"./**/*.ts",
"!./node_modules"
]
}
如果我使用tsc命令编译应用程序,一切似乎都很完美。我可以在dist / app上找到我的应用文件。
我想使用gulp自动化很多东西,所以我有以下gulp文件:
var gulp = require('gulp');
const typescript = require('gulp-typescript');
var tsProject = typescript.createProject('tsconfig.json');
const sourcemaps = require('gulp-sourcemaps');
// TypeScript compile
gulp.task('compile', function () {
return gulp
.src(['./app/**/*.ts'])
.pipe(sourcemaps.init())
.pipe(typescript(tsProject))
.pipe(sourcemaps.write('.'))
.pipe(gulp.dest('dist/app'));
});
当我运行gulp compile时,我遇到了很多错误:
/home/user/workspace/projects/node_modules/rxjs/operator/toPromise.d.ts(10,36): error TS2304: Cannot find name 'Promise'
/home/user/workspace/projects/node_modules/rxjs/operator/toPromise.d.ts(10,36): error TS2304: Cannot find name 'Set'
/home/user/workspace/projects/node_modules/rxjs/operator/toPromise.d.ts(10,36): error TS2304: Cannot find name 'Map'
在定位ES5时,gulp-typescript似乎无法使用ES6语法。
如果我在tsconfig.json中将目标更改为es6,一切正常。 但是我当然需要一个适用于相对较旧的浏览器的输出。
我发现了很多我尝试过的建议,比如在主要ts文件中添加一些引用,但没有任何效果。
答案 0 :(得分:0)
这是gulp-typescript版本的一个问题,它是:
"gulp-typescript": "^2.14.0",
我不知道这个软件包是如何工作的,但它看起来并没有使用当前安装的打字稿软件包,而是它自己的版本。
当我升级版本时,一切正常。
"gulp-typescript": "^3.0.2",