คำถามของฉันคือ: อะไรคือความแตกต่างระหว่างbabel-preset-stage-0
, babel-preset-stage-1
, babel-preset-stage-2
และbabel-preset-stage-3
และสิ่งที่เป็นทางเลือกที่ดีที่สุดเมื่อเราพัฒนาด้วยES6
?
คำถามของฉันคือ: อะไรคือความแตกต่างระหว่างbabel-preset-stage-0
, babel-preset-stage-1
, babel-preset-stage-2
และbabel-preset-stage-3
และสิ่งที่เป็นทางเลือกที่ดีที่สุดเมื่อเราพัฒนาด้วยES6
?
คำตอบ:
ค่าที่ตั้งไว้ล่วงหน้าของ Babel เปรียบได้กับกระบวนการ TC39และสถานะที่แตกต่างกันของแต่ละข้อเสนอสำหรับการเปลี่ยนแปลงภาษาที่อาจเกิดขึ้น ซึ่งรวมถึงการนำไปใช้งานและการเติม polyfills สำหรับการเปลี่ยนแปลงที่เสนอทั้งหมดในขั้นตอนนั้น
สิ่งที่อยู่ในปัจจุบันStage-0
คือ Strawman ไม่ใช่ ES6 เป็น Javascript ในอนาคตและไม่แน่ใจอย่างแน่นอนว่าจะทำให้เป็นข้อกำหนด ECMAScript อย่างเป็นทางการ
โปรดอย่าเพิ่งตั้งค่าstage-0
ให้มันทำงานโดยไม่เข้าใจผลที่จะเกิดขึ้น
Babel Preset ที่มีเฉพาะคุณสมบัติ ES6 คือ preset-es2015
stage-0
แต่ไม่ปลอดภัยอย่างสิ้นเชิงจากการเปลี่ยนแปลงหรือแม้แต่การเลิกใช้งานทั้งหมด (ดูข้อเสนอตัวสร้างการโทรซึ่งถูกถอนออกไปหลังจากขั้นตอนที่ 1) แต่อาจกล่าวได้เช่นเดียวกันกับด่านอื่น ๆ นอกเหนือจากด่าน 4 (เช่นจบแล้ว)
preset-es2015
ด้วยbabel-preset-node6
วันนี้หากใช้ Node 6 หรือดีกว่า
babel-preset-env
ซึ่งสามารถกำหนดเป้าหมายสภาพแวดล้อมใดก็ได้!
babel-preset-env
แทนbabel-preset-es2015
. babel-preset-es2015
ล้าสมัยเกือบ
ตามที่อธิบายไว้ส่วนใหญ่โดยคำตอบอื่น ๆ ด่าน 4 มีความเสถียรที่สุดและด่าน 0 อันตรายที่สุด นี่คือรายละเอียดเล็กน้อยในระดับสูงสำหรับ 5 ขั้นตอนจากคำตอบก่อนหน้าและเอกสารประกอบ ฉันเพิ่มสิ่งนี้เพราะเมื่อฉันมาถึงสิ่งนี้ฉันคาดหวังว่าจะมีรายละเอียดระดับสูงมากขึ้นว่าแต่ละด่านคืออะไร:
พร้อมสำหรับการรวมไว้ใน ECMAScript Standard ผ่านการทดสอบแล้วและจะเป็นส่วนหนึ่งของการแก้ไขครั้งต่อไป
รวมข้อความข้อมูลจำเพาะแบบเต็มและรวมถึงปลั๊กอินที่ส่วนใหญ่ผ่านการทดสอบและให้คำติชม โซลูชันเสร็จสมบูรณ์และการเปลี่ยนแปลงเพิ่มเติมทั้งหมดขึ้นอยู่กับประสบการณ์การใช้งาน
การสนับสนุนเพิ่มเติมสำหรับปลั๊กอินเสร็จสมบูรณ์ให้มากที่สุด ข้อกำหนดสำหรับสิ่งเหล่านี้ส่วนใหญ่จะพบเฉพาะการเปลี่ยนแปลงที่เพิ่มขึ้นระหว่างทาง ความหมายและ api คาดว่าจะสมบูรณ์ ส่วนใหญ่จะกลายเป็นส่วนหนึ่งของข้อมูลจำเพาะ
แต่ละระดับจะรวมในขณะที่ 4 รวม 3 รวม 2 และอื่น ๆ ... ฉันหวังว่าการสรุปนี้จะช่วยใครบางคนในอนาคต
ขั้นตอนแสดงถึงขั้นตอนตามที่กำหนดโดยกระบวนการ TC39 ซึ่งใช้คุณลักษณะต่างๆจากแนวคิดที่บ้าคลั่ง แต่มีประโยชน์ไปสู่มาตรฐานที่ยอมรับเช่น ES6 กระบวนการนี้ใช้เวลาพอสมควรเนื่องจากทุกกรณีจะต้องมีการพูดคุยคิดทดสอบทำโพลีฟิลล์พูดคุยกันมากขึ้น ฯลฯ นั่นคือมันเป็นตัวกำหนดมาตรฐาน เป้าหมายคือการพูดว่า "ES6" จะมีความหมายที่สมบูรณ์และครบถ้วนเหมือนกับที่พูดว่า "ES5"
ในทางปฏิบัติข้อกำหนดของโครงการของคุณอาจมีตั้งแต่การคงอยู่ไปจนถึงความพยายามและความจริงไปจนถึงการเล่นด้วยคุณสมบัติทางภาษาที่สะดวกสบายถ้าคลุมเครือ คุณอาจต้องการเริ่มต้นด้วยลิงก์เหล่านี้:
ภาพรวมกระบวนการ TC39 : รวมถึงแผนภูมิที่ดีเกี่ยวกับความหมายของขั้นตอนและความคืบหน้าของคุณลักษณะจากขั้นตอนหนึ่งไปอีกขั้น ด้านล่างนี้คือภาพรวมของ TC39
ข้อเสนอที่ใช้งานอยู่ : ภาพรวมคร่าวๆว่าข้อเสนออยู่ในขั้นตอนใดนอกจากนี้ยังมีลิงก์ไปยังข้อเสนอสำเร็จรูปไม่ใช้งานและขั้นที่ 0 วันนี้เมษายน 2017 Public Class Fields อยู่ในขั้นตอนที่ 2 ซึ่งหมายความว่ามีการอธิบายอย่างแม่นยำและได้รับมอบหมายผู้ตรวจสอบ แต่ยังไม่ได้รับการตรวจสอบทั้งหมด
Babel Preset Package สำหรับด่าน 3 : หน้าปลั๊กอินที่มีลิงก์ไปยัง Git และ NPM สำหรับข้อเสนอขั้นที่ 3 ทั้งหมด โดยทั่วไปปลั๊กอินนี้จะดึงคอลเล็กชันของแพ็กเกจที่ตามทฤษฎีแล้วเติมเต็มข้อเสนอปัจจุบันใน TC39 ขั้นที่ 3 ในทางปฏิบัติข้อบกพร่องอาจเกิดขึ้นได้ นอกจากนี้คุณสามารถค้นหาสิ่งที่คล้ายกันในทำนองเดียวกันมันจะเชื่อมโยงไปยังหน้าปลั๊กอินสำหรับด่าน 2และด้านล่าง หน้าเหล่านั้นจะเชื่อมโยงไปยังแพ็คเกจที่มีทั้งข้อเสนอขั้นที่ 3 และข้อเสนอที่มีเสถียรภาพน้อยกว่า
Babel Preset 'env' : ค่าที่ตั้งไว้ล่วงหน้าของ Babel นี้รองรับข้อเสนอที่สมบูรณ์โดยเลือกแพ็คเกจที่ถูกต้องที่จำเป็นเพื่อรองรับคุณสมบัติเหล่านี้ในสภาพแวดล้อมที่เป็นที่รู้จัก ตัวอย่างเช่นnode
ไฟล์ปฏิบัติการในระบบต้องการปลั๊กอินน้อยกว่าเบราว์เซอร์รุ่นเก่า อาจนึกถึงปลั๊กอิน 'stage-4' ที่รองรับคุณสมบัติในอนาคตที่ได้รับการอนุมัติ
โดยสรุปคุณจะต้องจัดการกับคุณสมบัติก่อนเผยแพร่เหล่านี้หากคุณใช้งาน หากคุณจำเป็นต้องใช้ให้เลือกจำนวนสเตจสูงสุดที่มีสิ่งที่คุณต้องการ หากคุณต้องการเพียงแค่การติดตั้งของเล่นที่มีคุณสมบัติบ้าๆเพื่อพูดคุยเกี่ยวกับเครื่องทำน้ำเย็นให้ไปข้างหน้าและคว้าด่าน 0
นี่คือจุดเริ่มต้นที่ดีที่สุดในการทำความเข้าใจ ค่าที่ตั้งไว้ล่วงหน้าของ Babel คืออะไร
ข้อความที่ตัดตอนมาจากลิงค์:
ด่าน 0 - Strawman: เพียงแค่ความคิดปลั๊กอิน Babel ที่เป็นไปได้
ด่าน 1 - ข้อเสนอ: สิ่งนี้คุ้มค่าที่จะดำเนินการต่อไป
ด่าน 2 - ร่าง: ข้อมูลจำเพาะเริ่มต้น
ขั้นตอนที่ 3 - ผู้สมัคร: ข้อมูลจำเพาะที่สมบูรณ์และการใช้งานเบราว์เซอร์เริ่มต้น
ด่าน 4 - จบแล้ว: จะถูกเพิ่มในรุ่นปีถัดไป
ภาพรวม :
preset
ในแง่ของ babel และแต่ละพรีเซ็ตมีปลั๊กอินจากระดับความเสี่ยงต่างๆpreset-0
หมายความว่ามีปลั๊กอินสำหรับฟีเจอร์ที่ทดลองใช้มากและด้วยเหตุนี้จึงมีความเสี่ยงสูงที่จะทำให้มันเป็นไปตามข้อกำหนดขั้นสุดท้าย มันเหมือนกับความคิดที่มาถึงนักพัฒนาที่ Javascript ควรมีคุณลักษณะเฉพาะและเขาได้ทำงานบางอย่างเพื่อนำไปสู่กระบวนการเสนอ TC-39preset-1
มีปลั๊กอินสำหรับแนวคิดคุณลักษณะที่ TC-39 ยอมรับและพวกเขาคิดว่ามันคุ้มค่าที่จะใช้งานได้preset-2
ปลั๊กอินสำหรับคุณลักษณะที่ร่างเริ่มต้นพร้อมสำหรับคุณลักษณะนี้ และดำเนินต่อไป ..ดังนั้นจึงอาจเกิดขึ้นได้ที่ฟีเจอร์ใน Stage 0 ถึงด่าน 2 ในบางครั้งและสุดท้ายจะอยู่ใน Javascript รุ่นถัดไปในภายหลัง
ดังนั้นในแต่ละเวอร์ชันของ Babel Presets เหล่านี้คุณจะพบชุดปลั๊กอินที่แตกต่างกัน นอกจากนี้ยังอาจเกิดขึ้นได้ที่คุณลักษณะในขั้นตอน 0 ได้ผ่านการเปลี่ยนแปลงบางอย่างและทำให้เกิดการเปลี่ยนแปลงในลักษณะการทำงานของมัน มาถึงแล้วสมมติว่า stage-2 ด้วย API ที่แตกต่างกันโดยสิ้นเชิง ดังนั้นนักพัฒนาจึงต้องตรวจสอบให้แน่ใจว่าเมื่อพวกเขาอัปเดตปลั๊กอินเหล่านี้พวกเขาได้ทำการเปลี่ยนแปลงที่จำเป็นกับโค้ดของพวกเขา
คำถามเดิมคือ "อะไรคือความแตกต่างระหว่าง babel-preset-stage-0, babel-preset-stage-1, babel-preset-stage-2 และ babel-preset-stage-3" เป็นเรื่องแปลกที่คำตอบโดยเน้นที่ "ความแตกต่าง ระหว่าง TC39 stage-0, stage-1 .. คำศัพท์ "ได้รับการโหวตในขณะที่มีเพียงหนึ่งเดียวที่เกี่ยวข้อง (แม้ว่าจะไม่ถูกต้อง) จะถูกลงคะแนน หากต้องการเสนอราคาจากเว็บไซต์ babel:
Babel preset คือรายการปลั๊กอินที่แชร์ได้
การตั้งค่าล่วงหน้า Babel Stage อย่างเป็นทางการติดตามกระบวนการ TC39 Staging สำหรับข้อเสนอไวยากรณ์ใหม่ใน JavaScript
ค่าที่ตั้งไว้ล่วงหน้าแต่ละรายการ (เช่น stage-3, stage-2 เป็นต้น) รวมปลั๊กอินทั้งหมดสำหรับสเตจนั้น ๆ และที่อยู่ด้านบน ตัวอย่างเช่น stage-2 รวม stage-3 และอื่น ๆ
แนวคิดหลักคือ 'สิ่งที่เหนือกว่า' ฉันไม่ได้คำตอบในครึ่งหลังเนื่องจากคำตอบข้างต้นดีมากในส่วนนั้น
ฉันได้รับมัน พวกคุณสามารถอ้างอิงhttps://babeljs.io/docs/plugins/preset-stage-0/
ในคำสั้น ๆpreset-stage-0
ประกอบด้วยฟังก์ชันทั้งหมดที่preset-stage-1
มีและ preset-stage-1
มีฟังก์ชันทั้งหมดที่preset-stage-2
มีและอื่น ๆ ...
ตัวเลขที่ต่ำกว่ามีประสิทธิภาพมากกว่า ในโครงการของคุณหากคุณไม่กังวลกับปัญหาเพียงตั้งค่าstage-0
...
stage-0
จริง ๆ แล้วคืออะไร? เนื่องจากคุณพูดว่า "ตัวเลขที่ต่ำกว่ามีประสิทธิภาพมากกว่า" ฉันไม่เชื่อ
stage
กับES6
, @RGraham The Babel Preset which contains only ES6 features is preset-es2015
ได้ชี้ให้เห็นว่า ขอบคุณ!
babel-preset-stage-0
รวมถึงปลั๊กอินทั้งหมดตั้งแต่stage-0
ถึงstage-3
. หมายความว่าฉันต้องการคุณสมบัติทั้งหมดที่เสนอไม่ว่าพวกเขาจะนำเสนอได้หรือไม่ก็ตาม
stage-1
? ใช้แล้วปลอดภัยจริงหรือ?stage-1
คุณลักษณะบางอย่างสามารถเลิกใช้งานและ API จะเปลี่ยนแปลงในอนาคตได้หรือไม่