เชิงมุม: ไม่พบสัญญาแผนที่การตั้งค่าและตัววนซ้ำ


176

หลังจากติดตั้งเชิงมุมที่ typescript คอมไพเลอร์ให้ได้รับข้อผิดพลาดบางอย่างเกี่ยวกับไม่พบPromise, Map, และSetIterator

จนถึงตอนนี้ฉันเพิกเฉย แต่ตอนนี้ฉันต้องการPromiseรหัสของฉันจึงสามารถทำงานได้

import {Component} from 'angular2/core';
@Component({
    selector: 'greeting-cmp',
    template: `<div>{{ asyncGreeting | async}}</div>`
})
export class GreetingCmp {
    asyncGreeting: Promise<string> = new Promise(resolve => {
// after 1 second, the promise will resolve
        window.setTimeout(() => resolve('hello'), 1000);
    });
}

Additional information:
npm -v is 2.14.12
node -v is v4.3.1
typescript v is 1.6

ข้อผิดพลาด:

................ERROS OF MY CODE.................
    C:\Users\armyTik\Desktop\angular2\greeting_cmp.ts
    Error:(7, 20) TS2304: Cannot find name 'Promise'.
    Error:(7, 42) TS2304: Cannot find name 'Promise'.
    .........................................
    C:\Users\armyTik\Desktop\angular2\node_modules\angular2\platform\browser.d.ts
    Error:(77, 90) TS2304: Cannot find name 'Promise'.
    C:\Users\armyTik\Desktop\angular2\node_modules\angular2\src\core\application_ref.d.ts
    Error:(83, 60) TS2304: Cannot find name 'Promise'.
    Error:(83, 146) TS2304: Cannot find name 'Promise'.
    Error:(96, 51) TS2304: Cannot find name 'Promise'.
    Error:(96, 147) TS2304: Cannot find name 'Promise'.
    Error:(133, 90) TS2304: Cannot find name 'Promise'.
    Error:(171, 81) TS2304: Cannot find name 'Promise'.
    C:\Users\armyTik\Desktop\angular2\node_modules\angular2\src\core\change_detection\parser\locals.d.ts
    Error:(3, 14) TS2304: Cannot find name 'Map'.
    Error:(4, 42) TS2304: Cannot find name 'Map'.
    C:\Users\armyTik\Desktop\angular2\node_modules\angular2\src\core\debug\debug_node.d.ts
    Error:(14, 13) TS2304: Cannot find name 'Map'.
    Error:(24, 17) TS2304: Cannot find name 'Map'.
    Error:(25, 17) TS2304: Cannot find name 'Map'.
    C:\Users\armyTik\Desktop\angular2\node_modules\angular2\src\core\di\provider.d.ts
    Error:(436, 103) TS2304: Cannot find name 'Map'.
    Error:(436, 135) TS2304: Cannot find name 'Map'.
    C:\Users\armyTik\Desktop\angular2\node_modules\angular2\src\core\linker\compiler.d.ts
    Error:(12, 50) TS2304: Cannot find name 'Promise'.
    Error:(16, 41) TS2304: Cannot find name 'Promise'.
    C:\Users\armyTik\Desktop\angular2\node_modules\angular2\src\core\linker\dynamic_component_loader.d.ts
    Error:(108, 136) TS2304: Cannot find name 'Promise'.
    Error:(156, 150) TS2304: Cannot find name 'Promise'.
    Error:(197, 128) TS2304: Cannot find name 'Promise'.
    Error:(203, 127) TS2304: Cannot find name 'Promise'.
    Error:(204, 141) TS2304: Cannot find name 'Promise'.
    Error:(205, 119) TS2304: Cannot find name 'Promise'.
    C:\Users\armyTik\Desktop\angular2\node_modules\angular2\src\core\render\api.d.ts
    Error:(13, 13) TS2304: Cannot find name 'Map'.
    Error:(14, 84) TS2304: Cannot find name 'Map'.
    C:\Users\armyTik\Desktop\angular2\node_modules\angular2\src\facade\async.d.ts
    Error:(27, 33) TS2304: Cannot find name 'Promise'.
    Error:(28, 45) TS2304: Cannot find name 'Promise'.
    C:\Users\armyTik\Desktop\angular2\node_modules\angular2\src\facade\collection.d.ts
    Error:(1, 25) TS2304: Cannot find name 'MapConstructor'.
    Error:(2, 25) TS2304: Cannot find name 'SetConstructor'.
    Error:(4, 27) TS2304: Cannot find name 'Map'.
    Error:(4, 39) TS2304: Cannot find name 'Map'.
    Error:(7, 9) TS2304: Cannot find name 'Map'.
    Error:(8, 30) TS2304: Cannot find name 'Map'.
    Error:(11, 43) TS2304: Cannot find name 'Map'.
    Error:(12, 27) TS2304: Cannot find name 'Map'.
    Error:(14, 23) TS2304: Cannot find name 'Map'.
    Error:(15, 25) TS2304: Cannot find name 'Map'.
    Error:(95, 41) TS2304: Cannot find name 'Set'.
    Error:(96, 22) TS2304: Cannot find name 'Set'.
    Error:(97, 25) TS2304: Cannot find name 'Set'.
    C:\Users\armyTik\Desktop\angular2\node_modules\angular2\src\facade\lang.d.ts
    Error:(13, 17) TS2304: Cannot find name 'Map'.
    Error:(14, 17) TS2304: Cannot find name 'Set'.
    Error:(78, 59) TS2304: Cannot find name 'Map'.
    C:\Users\armyTik\Desktop\angular2\node_modules\angular2\src\facade\promise.d.ts
    Error:(2, 14) TS2304: Cannot find name 'Promise'.
    Error:(7, 32) TS2304: Cannot find name 'Promise'.
    Error:(8, 38) TS2304: Cannot find name 'Promise'.
    Error:(9, 35) TS2304: Cannot find name 'Promise'.
    Error:(9, 93) TS2304: Cannot find name 'Promise'.
    Error:(10, 34) TS2304: Cannot find name 'Promise'.
    Error:(11, 32) TS2304: Cannot find name 'Promise'.
    Error:(11, 149) TS2304: Cannot find name 'Promise'.
    Error:(12, 43) TS2304: Cannot find name 'Promise'.
    C:\Users\armyTik\Desktop\angular2\node_modules\angular2\src\http\headers.d.ts
    Error:(43, 59) TS2304: Cannot find name 'Map'.
    C:\Users\armyTik\Desktop\angular2\node_modules\angular2\src\http\url_search_params.d.ts
    Error:(11, 16) TS2304: Cannot find name 'Map'.
    C:\Users\armyTik\Desktop\angular2\node_modules\angular2\src\platform\browser\browser_adapter.d.ts
    Error:(75, 33) TS2304: Cannot find name 'Map'.
    C:\Users\armyTik\Desktop\angular2\node_modules\angular2\src\platform\dom\dom_adapter.d.ts
    Error:(85, 42) TS2304: Cannot find name 'Map'.
    C:\Users\armyTik\Desktop\angular2\node_modules\rxjs\CoreOperators.d.ts
    Error:(35, 67) TS2304: Cannot find name 'Promise'.
    Error:(50, 66) TS2304: Cannot find name 'Promise'.
    Error:(89, 67) TS2304: Cannot find name 'Promise'.
    Error:(94, 38) TS2304: Cannot find name 'Promise'.
    Error:(94, 50) TS2304: Cannot find name 'Promise'.
    C:\Users\armyTik\Desktop\angular2\node_modules\rxjs\Observable.d.ts
    Error:(46, 62) TS2304: Cannot find name 'Promise'.
    Error:(47, 42) TS2304: Cannot find name 'Iterator'.
    Error:(103, 74) TS2304: Cannot find name 'Promise'.
    Error:(103, 84) TS2304: Cannot find name 'Promise'.
    Error:(143, 66) TS2304: Cannot find name 'Promise'.
    Error:(158, 65) TS2304: Cannot find name 'Promise'.
    Error:(201, 66) TS2304: Cannot find name 'Promise'.
    Error:(206, 38) TS2304: Cannot find name 'Promise'.
    Error:(206, 50) TS2304: Cannot find name 'Promise'.
    C:\Users\armyTik\Desktop\angular2\node_modules\rxjs\observable\ForkJoinObservable.d.ts
    Error:(6, 50) TS2304: Cannot find name 'Promise'.
    Error:(7, 58) TS2304: Cannot find name 'Promise'.
    C:\Users\armyTik\Desktop\angular2\node_modules\rxjs\observable\FromObservable.d.ts
    Error:(7, 38) TS2304: Cannot find name 'Promise'.
    Error:(7, 51) TS2304: Cannot find name 'Iterator'.
    C:\Users\armyTik\Desktop\angular2\node_modules\rxjs\observable\PromiseObservable.d.ts
    Error:(9, 31) TS2304: Cannot find name 'Promise'.
    Error:(10, 26) TS2304: Cannot find name 'Promise'.

1
ติดตั้งรุ่นล่าสุดของtypescript สำหรับ Visual Studio 2015
mylesk

คำตอบ:


177

เชิงมุม 5 ที่มี Typescript ^ 2.0.0

สิ่งนี้ควรใช้งานได้ดีกับ Angular 2+ รุ่นก่อนหน้า

เพื่อให้สิ่งนี้ทำงานกับ typescript 2.0.0 ฉันได้ทำสิ่งต่อไปนี้

npm install --save-dev @types/core-js

tsconfig.json

 "compilerOptions": {
    "declaration": false,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "mapRoot": "./",
    "module": "es6",
    "moduleResolution": "node",
    "noEmitOnError": true,
    "noImplicitAny": false,
    "outDir": "../dist/out-tsc",
    "sourceMap": true,
    "target": "es5",
    "typeRoots": [
      "../node_modules/@types"
    ],
    "types": [
      "core-js"
    ]
  }

เพิ่มเติมเกี่ยวกับ @types ด้วย typescript 2.0.0

  1. https://blogs.msdn.microsoft.com/typescript/2016/06/15/the-future-of-declaration-files/
  2. https://www.npmjs.com/~types

ติดตั้งตัวอย่าง:

npm install --save-dev @types/core-js

ข้อผิดพลาดของตัวระบุซ้ำ

สิ่งนี้น่าจะเป็นเพราะการพิมพ์ซ้ำ ecmascript 6 กำลังถูกนำเข้ามาจากที่อื่นน่าจะเป็น es6-shim แบบเก่า

ตรวจสอบให้แน่ใจว่ามีการอ้างอิงไปยังไม่มีtypings.d.ts es6ลบการอ้างอิงใด ๆes6จากไดเรกทอรีการพิมพ์ของคุณหากคุณมี

ตัวอย่างเช่น:

สิ่งนี้จะขัดแย้งกับtypes:['core-js']ใน typings.json

{
  "globalDependencies": {
    "core-js": "registry:dt/core-js#0.0.0+20160602141332" 
    // es6-shim will also conflict
  }
}

การรวมcore-jsในอาเรย์ประเภทในtsconfig.jsonควรเป็นที่เดียวเท่านั้นที่นำเข้าจาก

CLI เชิงมุม 1.0.0-beta.30

หากคุณใช้ Angular-CLI ให้ลบอาร์เรย์ lib typings.jsonออก ดูเหมือนว่าจะขัดแย้งกับการประกาศ core-js ในรูปแบบต่างๆ

"compilerOptions" : {
  ...
  // removed "lib": ["es6", dom"],
  ...
},
"types" : ["core-js"]

ผู้ใช้งาน Webstorm / Intellij ใช้ Angular CLI

ตรวจสอบให้แน่ใจว่าคอมไพเลอร์ใน typescript ถูกปิดใช้งาน สิ่งนี้จะขัดแย้งกับ CLI เพื่อรวบรวม typescript ของคุณด้วย CLI คุณสามารถตั้งค่าการng serveกำหนดค่า

ป้อนคำอธิบายรูปภาพที่นี่

Tsconfig compilerOptions lib กับประเภท

หากคุณไม่ต้องการติดตั้งคำจำกัดความประเภท core js มีบางไลบรารี es6 ที่มาพร้อมกับ typescript เหล่านั้นจะถูกใช้ผ่านlib: []คุณสมบัติใน tsconfig

ดูตัวอย่างได้ที่นี่: https://www.typescriptlang.org/docs/handbook/compiler-options.html

หมายเหตุ: หาก --lib ไม่ได้ระบุไลบรารีเริ่มต้นจะถูกฉีด ไลบรารีเริ่มต้นที่ถูกฉีดคือ: ►สำหรับ --target ES5: DOM, ES5, ScriptHost ►สำหรับ - เป้าหมาย ES6: DOM, ES6, DOM.Iterable, ScriptHost

TL; DR

คำตอบสั้น ๆ อย่างใดอย่างหนึ่ง"lib": [ "es6", "dom" ]หรือสามารถใช้ในการแก้ปัญหา"types": ["core-js"] can't find Promise,Map, Set and Iteratorการใช้ทั้งคู่จะทำให้เกิดข้อผิดพลาดของตัวระบุซ้ำ


1
ขอบคุณสำหรับการอัปเดตและคำตอบที่ดี ฉันยอมรับคำตอบของคุณเพราะคนยังคงมาที่นี่เพื่อให้ข้อผิดพลาดนี้หายไปจนถึงขณะนี้ มีโอกาสที่คุณจะอัพเดตคำตอบของคุณเป็น RC 5 หรือไม่? ฉันกำลังเผชิญกับข้อผิดพลาดและทำตามคำตอบของคุณฉันสามารถใช้สัญญา แต่ตอนนี้มีข้อผิดพลาดมากมายจากไฟล์ node_modules \ @types \ es6-shim \ index.d.ts: "ตัวระบุซ้ำ 'PropertyKey' ในบรรทัด: 6,10,248,283,290 และอื่น ๆ ; .. ยังมีข้อผิดพลาดใน: C: \ Users \ armyTik \ Desktop \ rc5 \ store-app-02 \ node_modules \ typescript \ lib \ lib.es2015.core.d.ts: 17 : 13 ตัวระบุซ้ำกัน 'PropertyKey'
Stav Alfi

ฉันปรับปรุงคำตอบของฉัน หวังว่าจะช่วยให้สิ่งที่ชัดเจนขึ้นเล็กน้อย นี่น่าจะเหมือนกันทั้งสำหรับ RC5 และ RC4 ฉันเชื่อ
Kris Hollenbeck

ฉันได้เปลี่ยนมันเพื่อสะท้อนให้เห็นถึงแกนกลางดังนั้นฉันหวังว่ามันจะสับสนน้อยกว่า core-js และ es6 เป็นทั้งสำหรับการประกาศประเภทเฉพาะ es6 ฉันชอบ core-js เพราะดูเหมือนว่าจะครอบคลุมมากกว่า es6-shim
Kris Hollenbeck

ขอบคุณสำหรับการอัพเดท. คราวนี้ฉันไม่มีโชค ฉันอัพเดตข้อผิดพลาดปัจจุบันของฉัน
Stav Alfi

2
น่าจะเป็น lib เป็นทางออกที่ดีกว่า github.com/angular/angular/blob/…
อเล็กซ์

75

ฉันยังมีปัญหาเดียวกัน - "ไม่พบสัญญา" - เมื่อรหัสต้องการสร้างวัตถุสัญญา

พยายามแก้ปัญหาบางอย่างที่พบใน stackoverflow รวมถึงวิธีการที่จะนำออก System.config ({... }) เพื่อสร้าง system.js และรวมไว้ใน index.html

ในที่สุดฉันก็แก้ปัญหา ปัญหาคือใน index.html รวม es6-shim.min.js อย่างไรก็ตามใน tsconfig.json คุณสมบัติ "เป้าหมาย" ภายใต้ "compilerOptions" มีค่าเป็น "es5" หลังจากที่ฉันเปลี่ยนเป็น "es6" ข้อผิดพลาดจะหายไป


2
นี่เป็นปัญหาสำหรับฉันเช่นกัน ไม่มีใครรู้ว่าทำไมสิ่งนี้จะทำให้เกิดข้อผิดพลาดที่?
Nick Brady

แก้ไขข้อผิดพลาดที่ฉันได้รับใน IntelliJ IDEA / WebStorm
bentolor

5
แต่รหัส js จะต้อง transpiled เป็น es5 เนื่องจากเบราว์เซอร์บางตัวไม่พร้อมสำหรับ es6 มีใครมีปัญหา ES6 ในเบราว์เซอร์ที่แตกต่างกัน thankx!
bmnepali

ทำงานได้ดีสำหรับฉันใน angular2.1.0 คอมไพเลอร์ 2.1.0 core 2.1.0 สามัญ 2.1.1 rxjs5.0.0-beta.12 platform-browser2.1.0
Farhad goodarzi

ขอบคุณ! คุณช่วยฉันได้มากเวลา
Cristian Traìna

63

Angular 2 Final

- รองรับ es5 (ทำงานได้อย่างสมบูรณ์กับ TS 2.0.0 +)

es6-shimตอนนี้ไม่รองรับการอัปเดตหากคุณมีการติดตั้งทั้งสองแบบพร้อมกันes6-shim& core-jsร่วมกัน ลบการes6-shimพิมพ์โดยการกล่าวถึงใน tsconfig.json ตอนนี้คุณสามารถอ้างอิงด้านล่างcore-jsเพื่อes5รับการสนับสนุนด้านล่างmain.ts

///<reference path="./../typings/globals/core-js/index.d.ts"/>

tsconfig.json

exclude: [
   "node_modules", //<-- this would be needed in case of VS2015
   "node_modules/@typings",
   "typings"
]

- es6 suppport

คุณเพียงแค่ต้องตั้งค่า"target"คุณสมบัติเป็นes6จากนั้นทุกข้อผิดพลาดจะหายไป และรหัส transpiled จะอยู่ในes6รูปแบบ


ขอบคุณมาก. ฉันไม่มีโอกาสได้พบสิ่งนั้นด้วยตัวเอง
Stav Alfi

@StavAlfi np .. ที่เกิดขึ้น .. ดีใจที่ได้ช่วยคุณ .. ขอบคุณ :)
Pankaj Parkar

ด้วย beta.7 ควรติดตั้งหากคุณใช้การตั้งค่าโครงการในบทช่วยสอนเริ่มต้นอย่างรวดเร็ว คุณใช้เบต้ารุ่นใดของ Angular ฉันยืนยันการเปลี่ยนแปลงที่เกิดขึ้นกับ angular 2.0.0 beta.7
Marc

1
package.json ในบทช่วยสอนเริ่มต้นอย่างรวดเร็วสนับสนุนเวอร์ชันจริงของเชิงมุม 2 หากคุณคัดลอก package.json tscconfig.json และ typings.json ไปยังรูตโปรเจ็กต์ของคุณและโทร npm - ติดตั้งการตั้งค่าโปรเจ็กต์จะถูกปรับ
Marc

3
2.0.0-rc.1@PankajParkar ฉันเพิ่งเริ่มใช้ Angular สองสามวันที่ผ่านมาฉันทำงานแม้ว่าเอกสารเริ่มต้น [ที่นี่] () ในการpackage.jsonที่พวกเขาใส่"angular2-in-memory-web-api": "0.0.7"และส่วนที่เหลือของสิ่งเชิงมุมมาจาก"@angular/<module>": "2.0.0-rc.1"ที่<module>เป็นcommon, compiler, core, http, platform-browser, platform-browser-dynamic, router, และrouter-deprecated upgrade
Hector

42

อัปเดตตั้งแต่ angular-2.0.0-rc.4

TLDR;

  1. เปลี่ยนเป็น es6

    • ข้อผิดพลาดหายไป (w / บาง gotchas)
  2. เปลี่ยนเป็น es5

    • ติดตั้งแบบอักษร
    • ติดตั้ง es6 shim
    • ตรวจสอบให้แน่ใจว่าคอมไพล์ด้วยรหัสของคุณ
    • ข้อผิดพลาดหายไป

สำหรับผู้อ่าน:

ตัวเลือก 1: Transpile เป็น es6 หรือ es2015

tsconfig.json:

{
  "compilerOptions": {
    "target": "es6",
    "module": "system",
    "moduleResolution": "node",
     ...
  },
"exclude": [
    "node_modules",
    "jspm_packages"
  ]
}

โปรดทราบ uglifyjs ไม่รองรับ es6 ในขณะนี้ สิ่งนี้อาจส่งผลกระทบต่อคุณในการสร้างชุดการผลิต

ตัวเลือกที่ 2: Transpile เป็น es5 ติดตั้ง typings แล้วติดตั้ง es6-shim:

tsconfig.json:

{
  "compilerOptions": {
    "target": "es5",
    "module": "system",
    "moduleResolution": "node",
     ...
  },
  "exclude": [
    "node_modules",
    "jspm_packages"
  ]
}

ติดตั้ง typings แล้วติดตั้ง es6-shim:

npm install typings --saveDev
typings install dt~es6-shim --global --save

หากคุณไปที่เส้นทางนี้คุณต้องตรวจสอบให้แน่ใจว่าตัวรวบรวม typescript สามารถค้นหาไฟล์. d.ts ได้

คุณมีสองทางเลือก:

ตรวจสอบให้แน่ใจว่า tsconfig.json อยู่ในระดับเดียวกับโฟลเดอร์การพิมพ์

ข รวมการอ้างอิงไว้ในไฟล์ main.ts ที่แอปพลิเคชัน angular2 ของคุณบูต

ตัวเลือก A: ตรวจสอบให้แน่ใจว่า tsconfig.json ของคุณอยู่ในระดับเดียวกับโฟลเดอร์การพิมพ์

หมายเหตุ: อย่าใช้การตั้งค่าสถานะแยกเพื่อแยกโฟลเดอร์การพิมพ์

project
|-- src
|-- node_modules
|-- package.json
|-- typings
|-- tsconfig.json

ตัวเลือก B: การอ้างอิงในไฟล์หลักก่อนบู๊ตสแตรป (อย่าทำสิ่งนี้):

ดังที่แสดงในคำตอบอื่น ๆ ไฟล์นี้ไม่รวมอยู่ใน Angular

main.ts:

/// <reference path="../../typings/globals/es6-shim/index.d.ts" />

2
ตัวเลือก 1 ทำงานได้ดีอย่างสมบูรณ์สำหรับ RC4 ตรวจสอบให้แน่ใจว่าได้ลบ core-js และการพิมพ์อื่น ๆ ที่มี Promise, Map, ฯลฯ เพื่อหลีกเลี่ยงความขัดแย้งของ namespace
wtfzn

1
ขอบคุณ 1 ทำงาน ต้องการ core-js หรือ es6-shim (ไม่ใช่ทั้งคู่) แล้วรวม. /typings/index.d.ts ในกระบวนการรวบรวม ts ของคุณ
k3a

1
--saveDevไม่ทำงานในตอนนี้ --save-devทำ.
George Sovetov

1
ไม่ควรtypingsติดตั้งทั่วโลกใช่ไหม
George Sovetov


8

นี่คือสิ่งที่ได้ผลสำหรับฉัน

ตรวจสอบว่ามีtypings.jsonไฟล์อยู่หรือไม่

มันดูเหมือนอะไรแบบนี้

{
  "globalDependencies": {
    "core-js": "registry:dt/core-js#0.0.0+20160317120654",
    "jasmine": "registry:dt/jasmine#2.2.0+20160505161446",
    "node": "registry:dt/node#6.0.0+20160613154055"
  }
}

ติดตั้งแพ็คเกจการพิมพ์ทั่วโลก

sudo npm install -g typings

หลังจากติดตั้งการพิมพ์แล้วให้เรียกใช้

typings install

จากนั้นรีสตาร์ทเซิร์ฟเวอร์


6

ฉันมีปัญหาที่คล้ายกันซึ่งไม่รู้จักวิธีการPromise.resolve () ผมเปลี่ยน"เป้าหมาย"ค่าจาก ES5 เพื่อES6ในtsconfig.json ที่แก้ไขปัญหา

หวังว่านี่จะช่วยได้


ใช่สิ่งนี้ช่วยฉันได้อย่างแน่นอน - เปลี่ยนค่า "เป้าหมาย" จาก ES5 เป็น ES6 ใน tsconfig.json
Greg Trevellick

5

เนื่องจาก Angular 2 ไปที่ RC 0 /angular2/typings/browser.d.ts จึงไม่ได้เป็นส่วนหนึ่งของการกระจาย Angular 2 อีกต่อไป ไฟล์สามารถติดตั้งแยกกัน

จากที่นี่: https://github.com/angular/angular/issues/8513มีตัวเลือกน้อย คนที่ทำงานให้ฉันคือ:

typings install es6-shim --ambient --save

// In your app.ts
/// <reference path="typings/browser.d.ts" />

1
ขอบคุณสำหรับสิ่งนี้ แต่คำสั่งสำหรับการพิมพ์ 1.0+ คือ: typings install dt ~ es6-shim --save --global ( github.com/typings/typings/issues/517 ) จากนั้นใช้ /// <พา ธ อ้างอิง = " typings / es6-shim / es6-shim.d.ts "/>
Simon Trewhella

4

ฉันจัดการเพื่อแก้ไขปัญหานี้โดยไม่ต้องเพิ่มการอ้างอิงแบบสามสแลชใด ๆ กับไฟล์ bootstrap ของ TS เปลี่ยนเป็น ES6 (ซึ่งนำปัญหามากมายเช่นเดียวกับ@DatBoiกล่าว) อัปเดต VS2015 NodeJSและ / หรือการNPMสร้างหรือติดตั้งแบบรวมtypingsทั่วโลก

นี่คือสิ่งที่ฉันทำในไม่กี่ขั้นตอน:

  • เพิ่มtypingsในโครงการpackage.jsonไฟล์
  • เพิ่มscriptบล็อกในpackage.jsonไฟล์เพื่อดำเนินการ / ปรับปรุงtypingsหลังจากแต่ละการกระทำของ NPM
  • เพิ่มtypings.jsonไฟล์ในโฟลเดอร์รูทของโครงการที่มีการอ้างอิงถึงcore-jsซึ่งเป็นหนึ่งในแพคเกจ shim / polyfill ที่ดีที่สุดในตอนนี้เพื่อแก้ไขปัญหา ES5 / ES6

นี่คือลักษณะของpackage.jsonไฟล์ที่ควรปรากฏ (บรรทัดที่เกี่ยวข้องเท่านั้น):

{
  "version": "1.0.0",
  "name": "YourProject",
  "private": true,
  "dependencies": {
    ...
    "typings": "^1.3.2",
    ...
  },
  "devDependencies": {
    ...
  },
  "scripts": {
      "postinstall": "typings install"
  }
}

และนี่คือtypings.jsonไฟล์:

{
  "globalDependencies": {
    "core-js": "registry:dt/core-js#0.0.0+20160602141332",
    "jasmine": "registry:dt/jasmine#2.2.0+20160621224255",
    "node": "registry:dt/node#6.0.0+20160621231320"
  }
}

( JasmineและNodeไม่จำเป็น แต่ฉันแนะนำให้เก็บไว้ในกรณีที่คุณจำเป็นต้องใช้ในอนาคต)

การแก้ไขนี้ทำงานได้ดีกับ Angular2 RC1 ถึง RC4 ซึ่งเป็นสิ่งที่ฉันต้องการ แต่ฉันคิดว่ามันจะแก้ไขปัญหาที่คล้ายกันกับแพ็คเกจไลบรารีที่เปิดใช้งาน ES6 ด้วยเช่นกัน

AFAIK ฉันคิดว่านี่เป็นวิธีที่สะอาดที่สุดเท่าที่จะทำได้โดยไม่ทำให้การตั้งค่าเริ่มต้นของ VS2015 แย่ลง

สำหรับข้อมูลเพิ่มเติมและการวิเคราะห์ปัญหาโดยละเอียดฉันขอแนะนำให้อ่านโพสต์นี้บนบล็อกของฉัน


3

หากใช้ Angular2 RC1 กับ typings v1.0 + ให้ใช้คำสั่ง:

typings install dt~core-js --save --global

เพื่อติดตั้งคำจำกัดความ core-js แล้วอ้างอิงดัชนีทั่วโลกของคุณใน main.ts ของคุณ:

/// <reference path="../../../typings/index.d.ts" />

หากใช้ es6-shim หรือไลบรารี shim อื่นให้ติดตั้ง typings สำหรับสิ่งนั้นแทน

อ้างถึงhttps://github.com/typings/typings/issues/517


2

ฉันสังเกตเห็นปัญหาเหล่านี้ปรากฏขึ้นหลังจากอัปเกรดจาก Angular 5 เป็น Angular 6 ฉันสามารถแก้ไขได้โดยทำสิ่งต่อไปนี้ใน VS2017:

  • ตรวจสอบให้แน่ใจว่าติดตั้ง TypeScript SDK แล้ว (ผ่าน Visual Studio Installer) สำหรับ TypeScript รุ่นเฉพาะของฉัน, 2.9
  • ตรวจสอบให้แน่ใจว่าคุณสมบัติโครงการระบบโมดูลถูกตั้งค่าให้ตรงกับใน tsconfig.json ของฉัน: ES2015 ซึ่งมักจะซิงค์โดยอัตโนมัติหากไฟล์ tsconfig อยู่ในรูทของโครงการ อย่างไรก็ตามเนื่องจากฉันใช้เทมเพลต VS Angular มันจึงวางไฟล์เหล่านี้ในโฟลเดอร์ย่อย "ClientApp" และคุณสมบัติโครงการระบบโมดูลไม่ได้ถูกตั้งค่า

VS2017 คุณสมบัติโครงการ

tsconfig.json:

{
  "compileOnSave": false,
  "compilerOptions": {
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es5",
    "lib": [
      "es2017",
      "dom"
    ],
    "module": "es2015",
    "baseUrl": "./"
  }
}

1

ฉันมีปัญหาเดียวกันเมื่อสร้างวัตถุสัญญาในชั้นเรียนของฉัน ด้วยการเปลี่ยนชื่อเป้าหมายเป็น "es5" จาก "es6" แก้ปัญหาของฉัน


1

แนวทางแก้ไขที่เป็นไปได้อีกประการหนึ่งคือติดตั้งงานพิมพ์ซ้ำ: ใช้
งานได้สำหรับฉัน"angular2": "2.0.0-beta.15"

  1. npm clean cache
  2. npm install
  3. npm install -g typings
  4. ลบtypingsไดเรกทอรีออกจากโครงการ (ติดตั้งโมดูลการพิมพ์ไดเรกทอรีที่ไหนก็ได้)
  5. typings install
  6. npm run

1

อีกทางออกที่ดี คุณต้องสร้างไฟล์ typings.json ในไดเรกทอรีรากของโครงการที่มีเนื้อหา:

{
  "globalDependencies": {
    "core-js": "registry:dt/core-js#0.0.0+20160725163759",
    "jasmine": "registry:dt/jasmine#2.2.0+20160621224255",
    "node": "registry:dt/node#6.0.0+20160909174046"
  }
}

จากนั้นติดตั้งแพคเกจการพิมพ์ทั่วโลกหรือในระดับท้องถิ่นหากยังไม่ได้ติดตั้ง (ฉันติดตั้งแบบโกลบอล):

sudo npm install --global typings

ในคำสั่งเรียกใช้ไดเรกทอรีรากของโครงการ:

typings install

หลังจากนั้นปัญหาก็จะถูกแก้ไข ไม่จำเป็นต้องเปลี่ยนเป้าหมาย tsconfig เป็น es6 หรือ es7 เว็บแอปพลิเคชันของคุณไม่รองรับหลังจากนั้นเบราว์เซอร์เวอร์ชันเก่าบางตัว


1

หากคุณมาที่นี่เพราะคุณเห็นข้อผิดพลาดเหล่านี้ใน Visual Studio 2017 แสดงว่าคุณมีปัญหาแตกต่างไปจากนี้หากคุณประสบความสำเร็จในการรวบรวม นี่เป็นเพราะบริการภาษาไม่เลือก tsconfig.json ของคุณ

https://developercommunity.visualstudio.com/content/problem/208941/vs-156-ignores-tsconfigjson-and-typescriptcompileb.html

คุณต้องตั้งค่า Build Action ของ tsconfig.json เป็น "Content" (คลิกขวา -> Properties) จากนั้น VS จะมารับมัน


0

ฉันพบการอ้างอิงใน boot.ts ไม่ใช่เส้นทางที่ถูกต้อง การอัพเดตพา ธ นั้นเพื่อ/// <reference path=">../../../node_modules/angular2/typings/browser.d.ts" />แก้ไขข้อผิดพลาดของสัญญา


0

ฉันกำลังฝึกซ้อมกับบทช่วยสอน (ฮีโร่)
หลังจากติดตั้ง @ types / core-js แสดงความคิดเห็นในคำตอบเหล่านี้แล้วฉันได้รับข้อผิดพลาด "ซ้ำรหัส"
ในกรณีของฉันมันถูกแก้ไขเป็นการลบบรรทัด lib ใน tsconfig.json

// "lib": ["es2015", "dom"]


-1

โครงสร้างไฟล์ของฉันเป็นดังนี้:

project
 |--node-modules
 |   |--angular2
 |   |   |--typings
 |   |   |   |--browser.d.ts
 |--src
 |--app.ts

วางด้านล่างลงในส่วนบนของ app.ts และแก้ไขปัญหาของคุณแล้ว

/// <reference path=">../../../node_modules/angular2/typings/browser.d.ts" />

การเปลี่ยนรายการ TARGET ให้ชี้ไปที่ ES6 ใน tsconfig.json แก้ไขปัญหานี้ให้ฉันตามที่ได้ชี้ไปในคำตอบบางข้อด้านบน
TheCopyPaster

-1

ผมได้รับปัญหาเดียวกันและสามารถที่จะหาได้ใน GitHub https://github.com/angular/angular-cli/issues/1901typescript@2.0.2ซึ่งระบุว่ามันเป็นปัญหากับ

ปรับลดแบบอักษร2.0.0ทั้งในระดับโลกและในประเทศช่วยให้ฉันแก้ไขได้

ทั่วโลก:

npm uninstall typescript -g
npm cache clean
npm install typescript@2.0.0 -g

ในพื้นที่: ไปที่โฟลเดอร์โครงการที่คุณสร้างขึ้นโดยใหม่

npm uninstall typescript
npm cache clean
npm install typescript@2.0.0

ฉันยังเปลี่ยนเวอร์ชันของ typescript ภายใน package.json จาก^2.0.0เป็น2.0.0แต่มันไม่ทำงานจนกว่าฉันจะลดระดับการติดตั้ง typescript แบบโลคัล


ทำไมผู้คนถึงลงความเห็นเช่นนี้ฉันอยากจะรู้ว่าทำไมนี่เป็นความคิดที่ไม่ดี หาก typescript เป็นภาษา transpiled และถูกแปลงเป็นจาวาสคริปต์มันจะปลอดภัยเท่ากับเบราว์เซอร์ของคุณเท่านั้นดังนั้นจึงไม่เหมือนกับว่ามีความเสี่ยงใช่ไหม
user3505901
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.