首頁  >  文章  >  web前端  >  介紹在Node.js中使用原生ES模組

介紹在Node.js中使用原生ES模組

巴扎黑
巴扎黑原創
2017-09-20 09:30:581466瀏覽

這篇文章主要介紹了在 Node.js 中使用原生 ES 模組方法解析,還有部分內容的鏈接,下面我們就來一起看看吧,需要的朋友可以參考下。

從版本 8.5.0 開始,Node.js 開始支援原生 ES 模組,可以透過命令列選項開啟該功能。新功能很大程度得歸功於 Bradley Farias。

1.示範

這個範例的程式碼目錄結構如下:


esm-demo/
 lib.mjs
 main.mjs

lib.mjs:


export function add(x, y) {
 return x + y;
}

main.mjs:


import {add} from './lib.mjs';
console.log('Result: '+add(2, 3));

執行示範:


$ node --experimental-modules main.mjs
Result: 5

2.清單:需要注意的事情

#ES 模組:

##·不能動態導入模組。但是 動態import() 的相關工作正在進行中,應該很快就能提供支援。

·沒有元變量,如 __dirname 和 __filename。但是,有一個的類似功能的提案:「import.meta」。看起來可能是這樣:


console.log(import.meta.url);

·現在所有模組標識符都是URL(這部分在Node.js 是新增的):

·檔- 帶有檔案副檔名的相對路徑: ../util/tools.mjs

·庫- 沒有檔案副檔名,也沒有路徑lodash

·如何更好地使npm 庫在瀏覽器中也可用(不使用bundler)仍有待觀察。一種可能性是引入 RequireJS 風格的配置數據,將路徑映射到實際路徑。目前,在瀏覽器中使用 bare path 的模組標識符是非法的。

與CJS 模組的互通性

你可以匯入CJS 模組,但它們總是只有預設的匯出- 即module.exports的值。讓 CJS 模組支援命名導出已經在做了,但可能需要一段時間。如果你能幫忙,可以來做。


import fs1 from 'fs';
console.log(Object.keys(fs1).length); // 86
import * as fs2 from 'fs';
console.log(Object.keys(fs2)); // ['default']

 · 不能在 ES 模組中使用 require()。主要原因是:

 · 路徑解析工作稍有不同:ESM 不支援 NODE_PATH 和 require.extensions。而且,它的標識符始終是 URL 也會導致一些細微差異。

 · ES 模組始終以非同步方式加載,這確保了與 Web 的最大相容性。這種載入風格並不能透過 require() 混合使用同步載入 CJS 模組。

 · 禁止同步模組載入也可以為 Top-level await 匯入 ES 模組保留後路(一個目前正在考慮的功能)。

3.早期版本的Node.js 上的ES 模組

#如果要在8.5.0 之前的Node.js 版本上使用ES 模組,請參閱John-David Dalton 的@std/esm。


提示:如果不啟用任何可解鎖的額外功能,將在Node.js 保持100% 相容原生ES 模組.


##FAQ


什麼時候可以不帶命令列選項使用ES 模組?


目前的計畫是在 Node.js 10 LTS 中預設可使用 ES 模組。


進一步閱讀


關於Node.js 和瀏覽器中ES 模組的更多資訊:

# ·

“Making transpiled ES modules more spec-compliant” [using ES modules natively vs. transpiling them via Babel]

 ·

“Module specifiers: what's new with ES modules?” [Why .mjs? How are module specifiers resolved? Etc.]

 ·

“Modules” [in-depth chapter on ES modules in “Exploring ES6”]
即將到來的ECMAScript 提案:


 ·

部落格: “ES proposal: import() – dynamically importing ES modules”

 ·

提案: “import.meta”

以上是介紹在Node.js中使用原生ES模組的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn