[英]Typescript with Angular2 - Targeting ES5 yields errors?
I'm using npm -v =>3.10.10
and I want to run a new project (empty one) of Angular2. 我正在使用npm -v =>3.10.10
,我想运行Angular2的新项目(空一个)。
If I write 如果我写
npm isntall angular2 --save
I get this : 我得到这个:
But after reading this answer which states : 但是阅读此答案后 ,状态如下:
You may need to manually install top-level modules that have unmet dependencies: 您可能需要手动安装具有未满足依赖性的顶级模块:
— I did this: -我这样做:
npm isntall es6-shim@^0.35.0 --save
npm isntall reflect-metadata@0.1.2 --save
npm isntall rxjs@5.0.0-beta.6 --save
npm isntall zone.js@^0.6.12 --save
So now I have this : 所以现在我有了这个:
So now package.json
looks like : 所以现在package.json
看起来像:
{
"name": "AngularJS2",
"version": "1.0.0",
"author": "Ray Villalobos",
"description": "...",
"repository": {
"type": "git",
"url": "https://github.com/planetoftheweb/angular2.git"
},
"devDependencies": {
"gulp": "^3.9.0",
"gulp-sourcemaps": "^1.6.0",
"gulp-typescript": "^2.10.0",
"gulp-webserver": "^0.9.1"
},
"dependencies": {
"angular2": "^2.0.0-beta.21",
"es6-shim": "^0.35.0",
"reflect-metadata": "^0.1.2",
"rxjs": "^5.0.0-beta.6",
"zone.js": "^0.6.12"
}
}
And tsconfig.json
looks like : tsconfig.json
看起来像:
{
"compilerOptions": {
"target": "es5",
"module": "system",
"moduleResolution": "node",
"sourceMap": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"removeComments": false,
"noImplicitAny": false
},
"exclude": [
"node_modules"
]
}
Now I run gulp
in cmd
and the site is up and running fine ( this is the gulpFile.js file ) : 现在,我在cmd
运行gulp
,并且站点正常运行( 这是gulpFile.js文件 ):
But looking at the cmd - I see many warnings : 但是看着cmd- 我看到很多警告 :
C:\Users\sff\Desktop\1>gulp [11:39:33] Using gulpfile
~\Desktop\1\gulpfile.js [11:39:33] Starting 'copylibs'... [11:39:33]
Starting 'typescript'... [11:39:33] Starting 'watch'... [11:39:33]
Finished 'watch' after 22 ms [11:39:33] Starting 'webserver'...
[11:39:33] Webserver started at http://localhost:8000 [11:39:33]
Finished 'webserver' after 8.84 ms
C:/Users/sff/Desktop/1/node_modules/angular2/platform/browser.d.ts(78,90):
error TS2304: Cannot find name 'Promise'.
C:/Users/sff/Desktop/1/node_modules/angular2/src/core/application_ref.d.ts(38,88):
error TS2304: Cannot find name 'Promise'.
C:/Users/sff/Desktop/1/node_modules/angular2/src/core/application_ref.d.ts(92,42):
error TS2304: Cannot find name 'Promise'.
C:/Users/sff/Desktop/1/node_modules/angular2/src/core/application_ref.d.ts(151,33):
error TS2304: Cannot find name 'Promise'.
C:/Users/sff/Desktop/1/node_modules/angular2/src/core/change_detection/differs/default_keyvalue_differ.d.ts(23,15):
error TS2304: Cannot find name 'Map'.
C:/Users/sff/Desktop/1/node_modules/angular2/src/core/change_detection/differs/default_keyvalue_differ.d.ts(25,16):
error TS2304: Cannot find name 'Map'.
C:/Users/sff/Desktop/1/node_modules/angular2/src/core/di/reflective_provider.d.ts(103,123):
error TS2304: Cannot find name 'Map'.
C:/Users/sff/Desktop/1/node_modules/angular2/src/core/di/reflective_provider.d.ts(103,165):
error TS2304: Cannot find name 'Map'.
However - I've already found the solution : 但是-我已经找到了解决方案 :
npm install @types/core-js --save-dev
我已经安装了npm install @types/core-js --save-dev
And 和
Changed the content of tsconfig.json
from : 将tsconfig.json
的内容从更改为:
"target": "es5"
---to ---> "target": "es6"
"target": "es5"
------> "target": "es6"
Now it looks good: 现在看起来不错:
Question 题
The errors were becuase Map
, Set
and Promise
are ES6
features. 错误是因为Map
, Set
和Promise
是ES6
功能。 -Which causes the compiler the use the normal es5 lib.d.ts
which lacks the definitions for the above types. -这会导致编译器使用普通的es5 lib.d.ts
,而缺少上述类型的定义。
But now things won't work as they should becuase not all browsers supports this. 但是现在事情将无法正常进行,因为它们并不是所有的浏览器都支持。
PS 聚苯乙烯
Other solution states that changing the TS file to : 其他解决方案指出将TS文件更改为:
"target": "es5",
"lib": ["es5", "es6", "dom"],
Should work. 应该管用。 But it's not. 但事实并非如此。 still same errors. 还是一样的错误。
you are trying to download a deprecated version of angular2 : 您正在尝试下载不再推荐使用的angular2版本:
use @angular/cli because everything ( tsconfig
, @types/
and shims
) is configured for you : 使用@ angular / cli,因为所有内容( tsconfig
, @types/
和shims
) tsconfig
为您配置:
npm install @angular/cli -g
ng new myApp
cd myApp
ng serve
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.