Programing

Node.js를 사용하려면 ES6 가져 오기 / 내보내기가 필요합니다.

lottogame 2020. 9. 29. 07:09
반응형

Node.js를 사용하려면 ES6 가져 오기 / 내보내기가 필요합니다.


공동 작업중인 프로젝트에서 사용할 수있는 모듈 시스템에 대해 두 가지 선택 사항이 있습니다.

  1. 사용하여 모듈을 가져 오기 require및 사용 수출 module.exportsexports.foo.
  2. ES6을 사용하여 모듈 가져 오기 import및 ES6을 사용하여 내보내기export

하나를 다른 것보다 사용하면 성능상의 이점이 있습니까? Node 1보다 ES6 모듈을 사용하려면 알아야 할 다른 것이 있습니까?


하나를 다른 것보다 사용하면 성능상의 이점이 있습니까?

ES6 모듈을 기본적으로 지원하는 JavaScript 엔진은 아직 없습니다. 당신은 Babel을 사용하고 있다고 스스로 말했습니다. 어쨌든 Babel 은 기본적 으로 CommonJS ( / ) 로 변환 import하고 export선언 합니다. 따라서 ES6 모듈 구문을 사용하더라도 Node.js에서 코드를 실행하면 내부에서 CommonJS를 사용하게됩니다.requiremodule.exports

CommonJS와 ES6 모듈 사이에는 기술적 인 차이가 있습니다. 예를 들어 CommonJS를 사용하면 모듈을 동적으로로드 할 수 있습니다. ES6에서는이를 허용하지 않지만이를 위해 개발중인 API가 있습니다.

ES6 모듈은 표준의 일부이므로 사용하겠습니다.


고려할 수있는 몇 가지 사용 / 기능이 있습니다.

요구 사항 :

  • 로드 된 모듈 이름이 사전 정의 된 / 정적이지 않은 동적로드 또는 특정 코드 흐름에 따라 "진정하게 필요한"경우에만 모듈을 조건부로로드 할 수 있습니다.
  • 로딩은 동기식입니다. require, s 가 여러 개인 경우 하나씩로드되고 처리됩니다.

ES6 수입품 :

  • 명명 된 가져 오기를 사용하여 필요한 부분 만 선택적으로로드 할 수 있습니다. 메모리를 절약 할 수 있습니다.
  • 가져 오기는 비동기식 일 수 있으며 (현재 ES6 모듈 로더에서는 실제로 그렇습니다) 조금 더 잘 수행 할 수 있습니다.

또한 Require 모듈 시스템은 표준 기반이 아닙니다. ES6 모듈이 존재하기 때문에 표준이 될 가능성은 거의 없습니다. 미래에는 성능 측면에서 유리한 다양한 구현에서 ES6 모듈에 대한 기본 지원이있을 것입니다.


주요 장점은 구문입니다.

  • 더 선언적 / 간단한 구문
  • ES6 모듈은 기본적으로 UMD (Universal Module Definition)를 쓸모 없게 만듭니다. 기본적으로 CommonJS와 AMD (서버 대 브라우저) 간의 분열을 제거합니다.

ES6 모듈의 성능상의 이점은 거의 없습니다. 브라우저에서 ES6 기능을 완전히 지원하는 경우에도 모듈을 번들링하려면 추가 라이브러리가 필요합니다.


하나를 다른 것보다 사용하면 성능상의 이점이 있습니까?

현재의 대답은 아니오입니다. 현재 브라우저 엔진 import/export은 ES6 표준에서 구현되지 않기 때문 입니다.

http://kangax.github.io/compat-table/es6/ 일부 비교 차트 는 이것을 고려하지 않으므로 Chrome에 대한 거의 모든 녹색을 볼 때 조심하십시오. importES6의 키워드는 고려되지 않았습니다.

즉, V8을 포함한 현재 브라우저 엔진은 JavaScript 지시문을 통해 기본 JavaScript 파일 에서 새 JavaScript 파일가져올 수 없습니다 .

( V8이 ES6 사양에 따라이를 구현할 때까지 버그가 몇 개 또는 몇 년 남았을 수도 있습니다.)

문서 는 우리에게 필요한 것이고이 문서 는 우리가 반드시 지켜야하는 것입니다.

그리고 ES6 표준은 우리가 (헤더) .h파일 이있는 프로그래밍 언어 C 에서처럼 모듈을 읽기 전에 모듈 종속성이 있어야한다고 말했습니다 .

이것은 훌륭하고 잘 테스트 된 구조이며 ES6 표준을 만든 전문가들이이를 염두에두고 있다고 확신합니다.

이를 통해 Webpack 또는 기타 패키지 번 들러가 일부 특수한 경우 번들을 최적화하고 필요하지 않은 번들에서 일부 종속성을 줄일 수 있습니다. 그러나 완벽한 의존성이있는 경우에는 결코 일어나지 않을 것입니다.

import/export네이티브 지원이 시작될 때까지 약간의 시간이 필요 하며 require키워드는 오랫동안 어디에도 가지 않습니다.

무엇입니까 require?

이것은 node.js모듈을로드하는 방법입니다. ( https://github.com/nodejs/node )

노드는 시스템 수준의 방법을 사용하여 파일을 읽습니다. 기본적으로 require. JavaScript 파일 / 모듈을로드하기 위해 (최종 시스템, Linux, Mac, Windows에 따라 다름) require과 같은 일부 시스템 호출로 uv_fs_open끝납니다.

To check that this is true, try to use Babel.js, and you will see that the import keyword will be converted into require.

enter image description here


Using ES6 modules can be useful for 'tree shaking'; i.e. enabling Webpack 2, Rollup (or other bundlers) to identify code paths that are not used/imported, and therefore don't make it into the resulting bundle. This can significantly reduce its file size by eliminating code you'll never need, but with CommonJS is bundled by default because Webpack et al have no way of knowing whether it's needed.

This is done using static analysis of the code path.

For example, using:

import { somePart } 'of/a/package';

... gives the bundler a hint that package.anotherPart isn't required (if it's not imported, it can't be used- right?), so it won't bother bundling it.

To enable this for Webpack 2, you need to ensure that your transpiler isn't spitting out CommonJS modules. If you're using the es2015 plug-in with babel, you can disable it in your .babelrc like so:

{
  "presets": [
    ["es2015", { modules: false }],
  ]
}

Rollup and others may work differently - view the docs if you're interested.


When it comes to async or maybe lazy loading, then import () is much more powerful. See when we require the component in asynchronous way, then we use import it in some async manner as in const variable using await.

const module = await import('./module.js');

Or if you want to use require() then,

const converter = require('./converter');

Thing is import() is actually async in nature. As mentioned by neehar venugopal in ReactConf, you can use it to dynamically load react components for client side architecture.

Also it is way better when it comes to Routing. That is the one special thing that makes network log to download a necessary part when user connects to specific website to its specific component. e.g. login page before dashboard wouldn't download all components of dashboard. Because what is needed current i.e. login component, that only will be downloaded.

Same goes for export : ES6 export are exactly same as for CommonJS module.exports.

NOTE - If you are developing a node.js project, then you have to strictly use require() as node will throw exception error as invalid token 'import' if you will use import . So node does not support import statements.

UPDATE - As suggested by Dan Dascalescu: Since v8.5.0 (released Sep 2017), node --experimental-modules index.mjs lets you use import without Babel. You can (and should) also publish your npm packages as native ESModule, with backwards compatibility for the old require way.

See this for more clearance where to use async imports - https://www.youtube.com/watch?v=bb6RCrDaxhw


The most important thing to know is that ES6 modules are, indeed, an official standard, while CommonJS (Node.js) modules are not.

In 2019, ES6 modules are supported by 84% of browsers. While Node.js puts them behind an --experimental-modules flag, there is also a convenient node package called esm, which makes the integration smooth.

Another issue you're likely to run into between these module systems is code location. Node.js assumes source is kept in a node_modules directory, while most ES6 modules are deployed in a flat directory structure. These are not easy to reconcile, but it can be done by hacking your package.json file with pre and post installation scripts. Here is an example isomorphic module and an article explaining how it works.


I personally use import because, we can import the required methods, members by using import.

import {foo, bar} from "dep";

FileName: dep.js

export foo function(){};
export const bar = 22

Credit goes to Paul Shan. More info.

참고URL : https://stackoverflow.com/questions/31354559/using-node-js-require-vs-es6-import-export

반응형