编程语言
首页 > 编程语言> > ES Modules in Node.js

ES Modules in Node.js

作者:互联网

ESM 在 Node.js 中的支持情况

Node.js 在 8.5 版本过后,开始以实验特性支持 ESM

image

Node 中使用 ESM 的条件及步骤

node --experimental-modules index.mjs
// ./module.mjs
export const foo = 'hello'

export const bar = 'world'
// ./index.mjs
import { foo, bar } from './module.mjs'

console.log(foo, bar)

// import fs from 'fs'

// fs.writeFileSync('./foo.txt', 'es module working')

// 内置模块兼容了 ESM 的提取成员方式
import { writeFileSync } from 'fs'
writeFileSync('./bar.txt', 'es module ')

// import _ from 'lodash'
// console.log(_.camelCase('ES Module'))

// 不支持,因为第三方模块都是导出默认成员
// import { camelCase } from 'lodash'
// console.log(camelCase('ES Module'))

ES Modules in Node.js 与 CommonJS 交互

ES Modules in Node.js 与 CommonJS 的差异

```JavaScript
// ./cjs.js
// 加载模块函数
console.log(require)

// 模块对象
console.log(module)

// 导出对象别名
console.log(exports)

// 当前文件的绝对路径
console.log(__filename)

// 当前文件所在目录
console.log(__dirname)
```

```JavaScript
// ESM 中没有 CommonJS 中的那些模块全局成员
// console.log(require)
// console.log(module)
// console.log(exports)

// 文件 url 地址
console.log(import.meta.url) // file:///C:/Users/%E9%87%91%E8%AF%81%E5%BC%95%E6%93%8E/Desktop/es-module-in-node/03-differences/esm.mjs

// 将文件 url 转换成路径
import { fileURLToPath } from 'url'
import { dirname } from 'path'
const __filename = fileURLToPath(import.meta.url)
console.log(__filename) // C:\Users\金证引擎\Desktop\es-module-in-node\03-differences\esm.mjs
const __dirname = dirname(__filename)
console.log(__dirname) // C:\Users\金证引擎\Desktop\es-module-in-node\03-differences
```

ES Modules in Node.js 新版本进一步支持

新版的 node 无需再讲 js 扩展名改成 mjs,只需在 package.json 中 配置 type: module 即能按照 ES Module 的形式去工作,如果还想使用 Common.js ,只需将扩展名修改为 cjs

Modules in Node.js - Babel 兼容方案

安装插件

yarn init -y

yarn add @babel/node @babel/core @babel/preset-env --dev

执行命令

yarn babel-node index.js --presets=@babel/preset-env

配置 .babelrc 文件,以上命令简化成:yarn babel-node index.js

{
 "presets": ["@babel/preset-env"]
}

preset 是 babel 插件的集合

image

使用单个插件

先移除 @babel/preset-env: yarn remove @babel/preset-env
yarn add @babel/plugin-transform-modules-commonjs --dev

修改 .babelrc 文件

{
  "plugins": [
    "@babel/plugin-transform-modules-commonjs"
  ]
}

标签:Node,console,log,Modules,module,js,import,foo,ES
来源: https://www.cnblogs.com/dwyWeb/p/16616135.html