การเขียนโปรแกรม es6-modules

1

ฉันจะสร้างชื่อแทนการนำเข้าเริ่มต้นใน Javascript ได้อย่างไร?

เมื่อใช้โมดูล ES6 ฉันรู้ว่าฉันสามารถตั้งชื่อแทนการนำเข้าได้ import { foo as bar } from 'my-module'; และฉันรู้ว่าฉันสามารถนำเข้าการนำเข้าเริ่มต้น import defaultMember from 'my-module'; ฉันต้องการนามแฝงการนำเข้าเริ่มต้นและฉันคิดว่าสิ่งต่อไปนี้จะได้ผล import defaultMember as alias from 'my-module'; แต่นั่นส่งผลให้เกิดข้อผิดพลาดในการแยกวิเคราะห์ (ไวยากรณ์) ฉันจะสร้างชื่อแทนการนำเข้าเริ่มต้นได้อย่างไร (หรือฉันสามารถ?)

381 javascript ecmascript-6 es6-modules

1

NodeJS วางแผนที่จะสนับสนุนโมดูลนำเข้า / ส่งออก es6 (es2015)

ฉันดูทั่วอินเทอร์เน็ตโดยไม่มีคำตอบที่ชัดเจนสำหรับเรื่องนี้ ปัจจุบัน NodeJS ใช้เฉพาะ CommonJS syntax เพื่อโหลดโมดูลและถ้าคุณต้องการใช้ไวยากรณ์โมดูล ES2015 จริงๆคุณต้อง transpile มาก่อนหรือใช้ตัวโหลดโมดูลภายนอกตอนรันไทม์ ปัจจุบันฉันยังไม่มั่นใจที่จะใช้วิธีใดวิธีหนึ่งจากสองวิธีนี้ผู้ดูแลระบบ NodeJS วางแผนที่จะสนับสนุนโมดูล ES2015 หรือไม่? ฉันไม่พบคำใบ้เกี่ยวกับเรื่องนี้เลย ในขณะนี้ NodeJS 6.x อ้างว่าสนับสนุนคุณสมบัติ 96% ของ ES2015 แต่ไม่มีการอ้างอิงถึงโมดูลใด ๆ ( ลิงก์สนับสนุน NodeJS ES2105 ) คุณรู้หรือไม่ว่า NodeJS จะสนับสนุนโมดูลเหล่านี้นอกกรอบในอนาคตอันใกล้

275 javascript node.js module ecmascript-6 es6-modules

13

เป็นไปได้หรือไม่ที่จะนำเข้าโมดูลจากไฟล์ทั้งหมดในไดเรกทอรีโดยใช้ไวด์การ์ด?

ด้วย ES6 ฉันสามารถนำเข้าการส่งออกจำนวนมากจากไฟล์ดังนี้: import {ThingA, ThingB, ThingC} from 'lib/things'; อย่างไรก็ตามฉันชอบองค์กรที่มีหนึ่งโมดูลต่อไฟล์ ฉันจบด้วยการนำเข้าเช่นนี้: import ThingA from 'lib/things/ThingA'; import ThingB from 'lib/things/ThingB'; import ThingC from 'lib/things/ThingC'; ฉันชอบที่จะทำสิ่งนี้: import {ThingA, ThingB, ThingC} from 'lib/things/*'; หรือสิ่งที่คล้ายกันโดยมีหลักการที่เข้าใจว่าแต่ละไฟล์มีการส่งออกเริ่มต้นหนึ่งรายการและแต่ละโมดูลมีชื่อเหมือนกับไฟล์ เป็นไปได้ไหม

256 javascript ecmascript-6 es6-modules

6

`ส่งออก const` เทียบกับ 'default default' ใน ES6

ฉันพยายามที่จะตรวจสอบว่ามีความแตกต่างใหญ่ระหว่างสองเหล่านี้นอกเหนือจากความสามารถในการนำเข้าexport defaultโดยเพียงทำ: import myItem from 'myItem'; และการใช้export constฉันสามารถทำได้: import { myItem } from 'myItem'; ฉันสงสัยว่ามีความแตกต่างและ / หรือใช้กรณีอื่นนอกเหนือจากนี้หรือไม่

204 javascript ecmascript-6 es6-modules

1

ไม่แนะนำให้ใช้“ use เข้มงวด” ใน ES6?

ฉันยังไม่คุ้นเคยกับ ECMAScript 6 ฉันเพิ่งโคลน Repo Starter Kit repo ซึ่งใช้ ES6 สำหรับรหัสแอปพลิเคชัน ฉันประหลาดใจที่เห็นว่ามีการกำหนดค่า linter ให้ห้ามการใช้งานuse strictdirective ซึ่งฉันคิดว่าถูกแนะนำในจาวาสคริปต์ก่อน ES6 ดังนั้นประเด็นคืออะไร

200 javascript ecmascript-6 strict es6-modules

7

Axios และ Fetch แตกต่างกันอย่างไร

ฉันกำลังเรียกใช้บริการเว็บโดยใช้การดึงข้อมูล แต่ฉันสามารถทำได้ด้วยความช่วยเหลือของ axios ดังนั้นตอนนี้ฉันสับสน ฉันควรจะไปหา axios หรือ fetch ไหม?

182 ajax reactjs xmlhttprequest es6-promise es6-modules

2

Javascript ES6 ส่งออก const เทียบกับการส่งออกให้

สมมติว่าฉันมีตัวแปรที่ฉันต้องการส่งออก ความแตกต่างระหว่างอะไร export const a = 1; VS export let a = 1; ฉันเข้าใจความแตกต่างระหว่างconstและletแต่เมื่อคุณส่งออกสิ่งที่แตกต่างกันคืออะไร

149 javascript ecmascript-6 es6-modules

7

ส่งตัวเลือกไปยังการนำเข้าโมดูล ES6

เป็นไปได้ไหมที่จะส่งตัวเลือกต่าง ๆ ไปยังการนำเข้า ES6 คุณแปลสิ่งนี้ได้อย่างไร: var x = require('module')(someoptions); ถึง ES6?

144 javascript module ecmascript-6 es6-modules

2

ใช้วงเล็บกับไวยากรณ์การนำเข้าจาวาสคริปต์

ฉันเจอไลบรารี javascript ที่ใช้ไวยากรณ์ต่อไปนี้เพื่อนำเข้าไลบรารี: import React, { Component, PropTypes } from 'react'; อะไรคือความแตกต่างระหว่างวิธีการข้างต้นและวิธีต่อไปนี้? import React, Component, PropTypes from 'react';

115 javascript ecmascript-6 es6-modules

4

“ …แก้ไขเป็นเอนทิตีที่ไม่ใช่โมดูลและไม่สามารถนำเข้าโดยใช้โครงสร้างนี้ได้” หมายความว่าอย่างไร

ฉันมีไฟล์ TypeScript บางไฟล์: MyClass.ts class MyClass { constructor() { } } export = MyClass; MyFunc.ts function fn() { return 0; } export = fn; MyConsumer.ts import * as MC from './MyClass'; import * as fn from './MyFunc'; fn(); สิ่งนี้ทำให้ฉันมีข้อผิดพลาดเมื่อพยายามใช้ new โมดูล "MyClass" แก้ไขเป็นเอนทิตีที่ไม่ใช่โมดูลและไม่สามารถนำเข้าโดยใช้โครงสร้างนี้ และเมื่อพยายามโทร fn() ไม่สามารถเรียกใช้นิพจน์ที่ไม่มีลายเซ็นการโทร สิ่งที่ช่วยให้?

93 typescript ecmascript-6 es6-modules

6

การนำเข้า ES2015 ไม่ทำงาน (แม้ในระดับบนสุด) ใน Firefox

นี่คือไฟล์ตัวอย่างของฉัน: <!DOCTYPE html> <html> <head> <title>Test</title> <script src="t1.js"></script> </head> <body></body> </html> t1.js: import Test from 't2.js'; t2.js: export const Test = console.log("Hello world"); เมื่อฉันโหลดหน้าใน Firefox 46 มันจะส่งคืน "SyntaxError: การประกาศการนำเข้าอาจปรากฏที่ระดับบนสุดของโมดูลเท่านั้น" - แต่ฉันไม่แน่ใจว่าคำสั่งนำเข้าระดับบนสุดสามารถรับที่นี่ได้มากเพียงใด ข้อผิดพลาดนี้เป็นปลาเฮอริ่งแดงและยังไม่รองรับการนำเข้า / ส่งออกใช่หรือไม่

92 javascript html firefox ecmascript-6 es6-modules

4

โมดูล ES6 ในเบราว์เซอร์: Uncaught SyntaxError: การนำเข้าโทเค็นที่ไม่คาดคิด

ฉันเพิ่งเริ่มใช้ES6 (ECMAScript 6) และฉันต้องการใช้ระบบโมดูลในเบราว์เซอร์ ฉันอ่าน ES6 ได้รับการสนับสนุนโดย Firefox และ Chrome แต่ฉันได้รับข้อผิดพลาดต่อไปนี้โดยใช้export Uncaught SyntaxError: Unexpected token import ฉันมีไฟล์ test.html <html> <script src="test.js"></script> <body> </body> </html> และไฟล์ test.js 'use strict'; class Test { static hello() { console.log("hello world"); } } export Test; ทำไม?

86 javascript html ecmascript-6 module es6-modules

2

วิธีการส่งออกโมดูล ES6 หลายโมดูลจากแพ็คเกจ NPM หนึ่งแพค

ฉันได้สร้างแพคเกจ NPM ที่ค่อนข้างเล็กซึ่งประกอบด้วย ES6 คลาสที่แตกต่างกันประมาณ 5 คลาสซึ่งมีอยู่ในไฟล์เดียวแต่ละไฟล์พวกเขาทั้งหมดมีลักษณะเช่นนี้: export default class MyClass { // ... } ฉันได้ตั้งค่าจุดเริ่มต้นสำหรับแพ็คเกจของฉันที่มีลักษณะดังนี้: export { default as MyClass } from './my-class.js'; export { default as MyOtherClass } from './my-other-class.js'; ฉันได้เรียกใช้จุดเริ่มต้นผ่าน webpack และ babel ที่ลงท้ายด้วย index.js transpiled และ minified การติดตั้งและนำเข้าแพคเกจใช้งานได้ดี แต่เมื่อฉันทำสิ่งต่อไปนี้จากรหัสลูกค้าของฉัน: import { MyClass } from 'my-package'; ไม่เพียงแค่นำเข้า …

16 javascript webpack babeljs es6-modules

5

แนวทางปฏิบัติที่ดีที่สุดของไลบรารีองค์ประกอบที่ใช้ร่วมกัน

ฉันกำลังสร้างไลบรารีคอมโพเนนต์ React ที่แชร์ได้ ไลบรารีมีส่วนประกอบมากมาย แต่ผู้ใช้อาจจำเป็นต้องใช้เพียงไม่กี่องค์ประกอบเท่านั้น เมื่อคุณรวมรหัสกับ Webpack (หรือพัสดุหรือ Rollup) มันจะสร้างไฟล์เดียวหนึ่งไฟล์ที่มีรหัสทั้งหมด ด้วยเหตุผลด้านประสิทธิภาพฉันไม่ต้องการให้เบราว์เซอร์ดาวน์โหลดรหัสทั้งหมดเว้นแต่จะใช้งานจริง ฉันคิดถูกหรือไม่ว่าไม่ควรรวมส่วนประกอบต่างๆ การรวมกลุ่มจะถูกทิ้งไว้กับผู้บริโภคของส่วนประกอบหรือไม่ ฉันจะปล่อยให้สิ่งอื่นใดกับผู้บริโภคส่วนประกอบหรือไม่ ฉันเพิ่งจะส่งผ่าน JSX และมันได้หรือไม่ หาก repo เดียวกันมีส่วนประกอบต่าง ๆ มากมายสิ่งที่ควรอยู่ใน main.js?

12 reactjs npm webpack es6-modules rollup

1

จะกำหนดค่า Jasmine ใน Rails 6 ได้อย่างไร?

ฉันจะกำหนดค่าจัสมินได้อย่างไรในสภาพแวดล้อม Rails 6 (ที่ Webpack แทนที่ไพพ์ไลน์ของสินทรัพย์สำหรับ Javascript) ดังนั้นฉันสามารถทดสอบโมดูล Javascript ที่ฉันเขียนขึ้นสำหรับแอพของฉันได้อย่างไร ฉันติดตั้งพลอยจัสมิน, วิ่งrails generate jasmine:install, และแก้ไขjasmine.ymlให้ชี้ไปที่ตำแหน่งของแหล่งจาวาสคริปต์และข้อมูลจำเพาะของฉัน ปัญหาคือฉันไม่สามารถใช้คำสั่งนำเข้า / ส่งออก (ตัวอย่างเช่นพยายามโหลดโมดูลแรกของฉันไปที่ผลการทดสอบในข้อผิดพลาดนี้ใน Chrome: Uncaught SyntaxError: Unexpected token 'export') จากสิ่งที่ฉันสามารถบอกได้ฉันต้องตั้งค่าจัสมินให้ใช้บาเบล แต่ฉันไม่มีโชคในการค้นหาคำแนะนำเกี่ยวกับวิธีการทำสิ่งนี้ในเค้าโครง Rails 6 ใหม่

9 ruby-on-rails jasmine babeljs es6-modules ruby-on-rails-6

คำถามติดแท็ก es6-modules