2020-05-26 Nodejs v12.17.0 LTS 版發佈，去掉 --experimental-modules 標誌。 1、雖然已在最新的 LTS v12.17.0 中支持，但是目前仍處於 Stability: 1 - Experimental 實驗階段，如果是在生產環境使用該功能，還應保 ...
2020-05-26 Nodejs v12.17.0 LTS 版發佈，去掉 --experimental-modules 標誌。
1、雖然已在最新的 LTS v12.17.0 中支持，但是目前仍處於 Stability: 1 - Experimental 實驗階段，如果是在生產環境使用該功能，還應保持謹慎，如果在測試環境可以安裝 n install v12.17.0 進行嘗試。
2、刪除標誌也是將 ESM 變為穩定性而邁出的重要一步，根據 Nodejs 官方的發佈說明，有望在今年下半年（10 月左右）刪除 Nodejs 12 中的警告，屆時 Node 14 將會成為 LTS。
3、除了node。結合多年開發經驗我還整理出2020最新企業級實戰視頻教程,包括 Vue3.0/Js/ES6/TS/React/node等想學的可進裙 519293536 免費獲取，小白勿進哦！
ES Modules 基本使用
通過聲明 .mjs 尾碼的文件或在 package.json 里指定 type 為 module 兩種方式使用 ES Modules，下麵分別看下兩種的使用方式：
使用方式一
構建如下目錄結構
├── caculator.js
├── index.js
└── package.json
複製代碼package.json
重點是將 type 設置為 module 來支持 ES Modules
{
"name": "esm-project",
"version": "1.0.0",
"main": "index.js",
"type": "module",
...
}
複製代碼caculator.js
export function add (a, b) {
return a + b;
};
複製代碼index.js
import { add } from './caculator.js';
console.log(add(4, 2)); // 6
複製代碼運行
與當前的 v14.3.0 不同的是在 v12.17.0 中使用 ESM 運行時仍然會觸發一個 experimental 警告信息。
$ n run v12.17.0 index.js
(node:6827) ExperimentalWarning: The ESM module loader is experimental.
6
複製代碼$ n run v14.3.0 index.js 6 複製代碼
使用方式二
通過指定文件擴展名為 .mjs 與 CommonJS 模塊進行區分，這樣是不需要在 package.json 中指定 type 為 module。
在上述例子基礎上修改文件擴展名即可。
├── caculator.mjs
├── index.mjs
複製代碼運行
$ n run v12.17.0 index.mjs
(node:6827) ExperimentalWarning: The ESM module loader is experimental.
6
複製代碼模塊導入導出的幾種方式
export 導出
export 用於對外輸出模塊，可導出常量、函數、文件等，相當於定義了對外的介面，兩種導出方式：
- export: 使用 export 方式導出的，導入時要加上 {} 需預先知道要載入的變數名，在一個文件中可以使用多次。
- export default: 為模塊指定預設輸出，這樣載入時就不需要知道所載入的模塊變數名，一個文件中僅可使用一次。
// caculator.js
export function add (a, b) {
return a + b;
};
export function subtract (a, b) {
return a - b;
}
const caculator = {
add,
subtract,
}
export default caculator;
複製代碼import 導入
import 語句用於導入另一個模塊導出的綁定，三種導入方式：
- 導入預設值：導入在 export default 定義的預設介面。
- as 別名導入：在導入時可以重命名在 export 中定義的介面。
- 單個或多個導入：根據需要導入 export 定一個的一個或多個介面。
import { add } from './caculator.js';
import caculator from './caculator.js';
import * as caculatorAs from './caculator.js';
add(4, 2)
caculator.subtract(4, 2);
caculatorAs.subtract(4, 2);
複製代碼import 的動態導入
可以像調用函數一樣動態的導入模塊，它將返回一個 Promise，但是這種方式需要 Top-Level await 支持，如果你不知道 Top-Level await 是什麼可以看下這篇文章 Nodejs v14.3.0 發佈支持頂級 Await 和 REPL 增強功能。
現在我們有如下導出模塊 my-module.js：
const sleep = (value, ms) => new Promise(resolve => setTimeout(() => resolve(value), ms));
export const hello = await sleep('Hello', 1000);
export const node = await sleep('Nodejs', 2000);
export default function() {
return 'this is a module';
}
複製代碼在 index.js 中可以像如下形式進行動態導入：
console.log('Start loading module...')
const myModule = await import('./my-module.js');
console.log('Output after 3000 ms.')
console.log(myModule.hello);
console.log(myModule.node);
console.log(myModule.default());
複製代碼運行
$ n run v14.3.0 --experimental_top_level_await index.js
Start loading module...
Output after 3000 ms.
Hello
Nodejs
this is a module
複製代碼總結：
1、2020-05-26 Nodejs v12.17.0 LTS 版發佈，在這之前如果我們使用 ES Modules 還需要加上標誌 --experimental-modules，而在本次版本發佈取消了這個標誌，本文也是對在 Nodejs 中使用 ES Modules 進行了入門講解，後續也會進行更深入的研究分享，希望看完你能有所收穫。
2、除了node。結合多年開發經驗我還整理出2020最新企業級實戰視頻教程， 包括 Vue3.0/Js/ES6/TS/React/node等想學的可進裙 519293536 免費獲取，小白勿進哦！
本文的文字及圖片來源於網路加上自己的想法,僅供學習、交流使用,不具有任何商業用途,版權歸原作者所有,如有問題請及時聯繫我們以作處理
