---
description: 🚧 under construction
---

# import ES module

[JS](../../..) ⟩ [module](../..) ⟩ [ES](..) ⟩ [import]() ⟩ example ⟩ import ES module &#x20;

{% hint style="success" %}
import modules from npm (Node Package Manager).
{% endhint %}

{% tabs %}
{% tab title="💈範例" %}
* replit：[import ES modules](https://replit.com/@pegasusroe/import-ES-modules#index.js)

```javascript
// ⭐️ To use this file as an ES module,
//    add this line to "package.json".
// -----------------------------------------------------------------
//
//     "type": "module",
//
// -----------------------------------------------------------------

// import {days as dayNames} from "date-names";
//         ^^^^
// -----------------------------------------------------------------
// ⛔ SyntaxError: Named export 'days' not found. 
// -----------------------------------------------------------------
// - The requested module 'date-names' is a CommonJS module, 
//   which may not support all module.exports as named exports.
//
// - CommonJS modules can always be imported via the default export, 
//   for example using:
//
//       import pkg from 'date-names';
//       const {days: dayNames} = pkg;
//
// -----------------------------------------------------------------

import pkg from 'date-names';    // import package from npm
const {days: dayNames} = pkg;

console.log(dayNames.length);    // 7
```
{% endtab %}

{% tab title="🧨 雷區" %}
{% hint style="danger" %}
importing a [**CommonJS**](../../commonjs) module from npm may cause

⛔ [<mark style="color:red;">**SyntaxError**</mark>](../../../err/syntax)：[<mark style="color:yellow;">**Named export 'xxx' not found**</mark>](../../../err/syntax/named-export-not-found):exclamation:
{% endhint %}
{% endtab %}

{% tab title="👥 相關" %}
* [export](../export "mention")
* [..](../.. "mention")
{% endtab %}

{% tab title="📗 參考" %}
* [ ] Eloquent JS ⟩ [ECMAScript Modules](https://eloquentjavascript.net/10_modules.html#h_hF2FmOVxw7)&#x20;
{% endtab %}

{% tab title="📘 手冊" %}
* [import](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import)
{% endtab %}
{% endtabs %}
