너는 반드시 esm를 사용해야 한다

tl；박사:

이제 node에서 JavaScript 모듈을 사용할 수 있으며 전송 없이 npm -S esm와 node -r esm foo.js만 있으면 프로그램을 실행할 수 있습니다.패키지의 최상위 수준에 "esm": "auto"를 추가합니다.json은 같은 응용 프로그램에서 모듈과 CJ를 불러오는 것을 쉽고 투명하게 합니다.
만약 당신이 아직도 이 점에 머물러 있다면, 우리가 어떻게 이 점에 이르게 되었는지에 대한 고집스러운 역사를 계속 읽어 보세요.
The History
Transpiling
The Problem
esm : A Better Solution

역사.

역사상 JavaScript는 브라우저일 뿐입니다.개발자들은 많은 기술을 사용하여 그들의 코드를 구성했는데, 이 모든 것은 기본적으로 전체 변수에 대한 추상적이다.이러한 해결 방안에는 CommonJS(또는'cjs')라는 대중이 좋아하는 해결 방안이 등장했다.

const { foo } = require('./bar')

const baz = foo + "qux"

module.exports = {
  quux: [baz]
}

CJS가 JS 개발자들 사이에서 흡인력을 얻은 것은 주로 NodeJS가 사용하는 모듈 시스템이기 때문이다.전방 개발자는 cjs 기반 응용 프로그램과 webpack 등 도구를 브라우저가 불러오고 실행할 수 있는 단일 파일 스크립트에 묶을 수 있다.
하나의 코드 라이브러리(일정 수량의 도구 논쟁을 통해)가 서버와 클라이언트에서 실행될 수 있다는 개념은 서버 측의 표현, NativeScript/React Native와 웹팩babel 등 도구의 급증, 그리고 협상할 수 없는 JS 개발 선결 조건을 초래했다.
2015년에 ECMAScript 버전 6은 언어급 모듈의 문법을 포함하여 발표되었다.

import { foo } from './bar.js'

const baz = foo + "qux"

export const quux = [baz]

이 모듈들은 정적, 단지 맨 윗부분일 뿐이다. 이것은 네가 아래의 이런 일을 할 수 없다는 것을 의미한다.

const moduleName = "foo" + "bar"
if (baz) {
  // nope!
  import { quz } from moduleName
}

CJS 사용자는 이미 이런 것에 익숙해졌다.다른 한편, js 모듈은 정적 분석을 할 수 있다는 것은 Rollup 등 차세대 도구가 js 파일을 분석하여 트리 떨림 같은 유용한 일을 할 수 있다는 것을 의미한다. 이것은 패키지에서 사용되지 않은 코드를 삭제하는 과정이다.이것은 개발자가 더 적은 코드를 발표하여 사용자가 사이트를 더욱 빨리 불러올 수 있도록 하는 데 도움이 된다.
방주: aproposal for dynamically imported modules는 3단계에 들어갔고 a number of browsers에서 제공되었다.
모듈과 모듈도(모듈 간의 기능 관계를 나타내는 논리 구조)를 어떻게 불러오는지의 세부 사항은 실시자, 즉 브라우저 공급업체와 노드 관리자에게 남겨진다.
브라우저 공급업체가 먼저 작성loader specification했지만 노드의 상황은 더욱 복잡했다. 비록 그들은 이미 가까워졌지만no final plan has emerged.

수송하다

ES2015규범(당시 ES6 또는'하모니')이 발표되었을 때 5-to-6(나중에 Babel로 변경)라는 프로젝트가 등장했다. JS 프로그래머가 경외심을 불러일으키는 새로운 ES6 기능을 사용하여 프로그램을 작성하고 낡은 브라우저와 인터넷 익스플로러가 지탱할 수 있는 코드를 제공한다.
한 언어나 한 언어의 버전을 다른 언어로 번역하는 과정을transpiling이라고 하는데 이것은 번역과com이 중첩된 조합이다.
바베타는 나중에 스위스 군도로 변했다.다양한 JavaScript 버전을 사용하거나 완전히 다른 언어를 사용하여 브라우저에서 실행되는 코드로 변환할 수 있습니다.

문제.

Babel은 웹 개발자에게 커다란 이익을 가져다 주었다.이것은 브라우저가 새로운 기능이나 제안된 기능을 실현하기 전에 이를 대규모로 탐색할 수 있도록 함으로써 이러한 기능의 가장자리 상황을 폭로하고 더욱 좋은 규범을 형성하는 데 도움이 된다.그것 또한 웹 개발에서 현재 겪고 있는 OOP/Proceedural 모델에서 더욱 기능적인 모델로의 거대한 변화에 큰 역할을 발휘했다.Babel은 또한 현재의 웹 개발자에게 다양한 도구와 제품을 제공한다...
...그러나 이것은 반드시 필요한 것이 아니다. 이것은 때때로 약간의 문제가 있을 수 있다.

운송 원가

개발자 Jamie K.


제이미 K🏳️‍🌈

JavaScript를 가로막는 세 가지 브라우저는 1)IE 11(네트워크의 2.7%) 2) 안드로이드 4.4-4.3(네트워크의 0.94%) Chrome 49(네트워크의 0.71%) 만약 우리가 이러한 브라우저를 지원하지 않는다면 대부분의 현대 JavaScript 문법 기능을 전환할 필요가 없다.(계속)
2018년 7월 26일 오후 19:46
현대 브라우저와 i8 등에 크고 일률적인 패키지를 제공하는 상업적 이유가 급속히 사라지고 있다.differential serving와 같은 현대 기술로 우리는 기능이 강한 브라우저에 최적화되고 간소화된 ES2018을 제공할 수 있으며 기능이 약한 브라우저에 비대하고 전송 패키지를 보존할 수 있다.이외에도 IE11 지원은 절대적으로 필요한 업무 응용 프로그램이 아니기 때문에 사용자가 최신과 가장 좋은 브라우저를 사용할 수 있을 뿐만 아니라 사용해야 하는 상황에서 이런 낡고 안전하지 않은 브라우저를 지원하는 것은 사실상 무책임하다.

원칙과 인지부하

노드 세계에서도 전송은 비용을 가져온다.babel 설정을 유지하는 것이 항상 가장 간단한 작업은 아닙니다.그러나 이 밖에transpiling은 교묘하게 이런 메시지를 전달했다. "이 코드 자체는 정상적이지 않다. 이 코드는 별도의 처리가 있어야만 정상적으로 운행할 수 있다."우리는 이 모듈에 대해 이렇게 말해서는 안 된다. 설령 CJS가 이 방면에서 앞서더라도.

esm: 간단한 해결 방안

esmlodashfame 등 회사의 마이크로소프트 개발자John-David Dalton가 개발한 우수한 소프트웨어 패키지입니다. 이것은 전송 모듈이 아닌 모듈 마운트기입니다.esm, 종잡을 수 없는'상호작용'이 있으면 된다™. 이 컴퓨터와 CJS 모듈을 손쉽게 혼용할 수 있습니다.
너는 심지어 대부분의 명령행 노드 프로그램을 사용할 수 있다.예를 들어 우수한 tape 테스트 라이브러리는 기존의 모듈 지원이 없지만 다음과 같이 쉽게 추가할 수 있습니다.

npx tape -r 'esm' './**/*.test.js'

요약

다음에 노드가 하나 있을 때js 프로젝트, 전송 모듈을 전송하기 위해babel 설정을 작성하기 전에 esm 시도해 보십시오.