f型网站,安徽网站建设电话,白银市做网站,美发网站带手机版[模块]ES6与cjs的混合开发 模块语言混合开发的原因Nodejs中使用ES6关于动态加载的讲解 项目的模块语言CJS 与 ESM 开发模块的使用方法普通模块引入json 文件的引入普通模块导出 CJS兼容ESMESM兼容CJS(推荐)全局变量--dirname-filename-esm库 问题Error: EPERM: operation not p… [模块]ES6与cjs的混合开发 模块语言混合开发的原因Nodejs中使用ES6关于动态加载的讲解 项目的模块语言CJS 与 ESM 开发模块的使用方法普通模块引入json 文件的引入普通模块导出 CJS兼容ESMESM兼容CJS(推荐)全局变量--dirname-filename-esm库 问题Error: EPERM: operation not permitted, renameSyntaxError: Cannot use import statement outside a moduleError: Cannot find module D:\serverjs\index 模块语言
现有的模块化开发语言主要包括
CJS(CommonJS):同步的模块化规范ESM-是 JavaScript 语言层面的模块规范,目标是取代其它所有模块化开发规范,成为前端领域的标准模块规范
因为 ESM 是下一代的标准所以开发的时候尽量使用ESM
混合开发的原因
因为最早使用的CJS(CommonJS)规范开发后来随着ES6规范的开始大部分的库陆续转化成ES6的规范但是部分仍旧是使用的CJS的规范在一个ESM的项目中使用了CJS的模块就导致了项目的混合开发
Nodejs中使用ES6
在 Node.js 中使用 ES6 的 import / export 与 require 的区别主要体现在以下几个方面
import / export 是 ES6 的模块化语法而 require 是 Node.js 的模块化语法import / export 是静态的只能在模块的顶层使用而 require 是动态的可以在任何地方使用import / export 可以导出多个变量、函数等而 require 只能导出一个对象import / export 是异步加载模块而 require 是同步加载模块
总的来说如果你使用的是 ES6 的语法建议使用 import / export 否则使用 require 但是如上所说ESM 是下一代的标准所以逐渐的nodejs使用ES6的方式越来越方便
关于动态加载的讲解
地址
项目的模块语言
package.json 中的 type 字段用来指定项目的类型默认为commonjs。type的取值包括
commonjs: 表示该包是一个 CommonJS 模块(即 Node.js 默认的模块格式)module: 表示该包是一个 ES 模块(即标准的 ECMAScript 模块格式)json: 表示该包仅包含 JSON 数据可以通过 require() 函数或 ES6 的 import 语句来导入
在项目中不同文件的后缀表明 .cjs是使用CommonJS规范 .mjs是使用ES规范 .js则以package.json中的type字段为准
所以可以通过以上不同的文件后缀来实现项目的混合开发
CJS 与 ESM 开发
CJS 与 ESM规范在使用上有非常多的不同之处下面是本人一个CJS的项目升级到ESM规范的过程中遇到的各种问题
模块的使用方法
CJS通过require引入module.exports导出
ESM通过import引入export导出
普通模块引入
const path require(path);//CJS
import path from path;//ESJjson 文件的引入
const pkg require(../package); //CJS 获取package.json的数据import pkg from ../package.json assert { type: json };//ESJimport是不可以直接引入json文件的
普通模块导出
module.exports upgrade;//cjs
export default upgrade;//esjCJS兼容ESM
(async function() {const esm await import(esm);esm.a();esm.b();
})();ESM兼容CJS(推荐)
ESM可以直接 importCJS 模块越来越多的库使用ESM建议新项目优先使用ESM规范。
import { a, b } from cjs;
a();
b():
//或者
import a from cjs;
a()全局变量–dirname-filename-esm库
ESM中没有注入__dirname、__filename全局变量可以通过dirname-filename-esm库获取
__dirname执行命令的文件所在目录的绝对路径不包含当前文件名 __filename当前文件的绝对路径包含文件名
import { dirname } from dirname-filename-esm// 拿到执行命令文件所在目录的绝对路径
const __dirname dirname(import.meta)
console.log(__dirname)import { filename } from dirname-filename-esm
// 获取文件绝对路径
const __filename filename(import.meta)// 如果不引入库dirname-filename-esm 可以通过以下方式
// import { fileURLToPath } from node:url
// const __filename fileURLToPath(import.meta.url)问题
Error: EPERM: operation not permitted, rename
请检查当前命令是不是在编辑器中执行要修改的文件夹是不是在编辑器中被打开;如果被打开请关闭编辑器在cmd等终端的对应项目目录下执行
请检查当前命令执行的命令是否已经存在将要被修改成的名称的文件夹或文件导致了命名冲突的问题如果已经存在修改新的命名或者删除已经存在的命名
SyntaxError: Cannot use import statement outside a module
该问题就是在cjs规范的项目中使用了import的导入方式此时
package.json 文件中 type:commonjs,表明使用CJS规范报错文件使用js后缀将默认遵循package.json设定的规范报错文件中使用了ESM的规范
解决方案是将报错文件的后缀改为mjs表明当前文件使用ESM规范
Error: Cannot find module ‘D:\serverjs\index’
该问题是在package中script中定义的某个命令test运行导致的
{script:{test :node ./serverjs/index}
}运行后报错 node:internal/modules/cjs/loader:936 throw err;
Error: Cannot find module ‘D:\serverjs\index’ 然后找到该文件确实存在但是后缀名是.mjs,所以命令无法自动识别后缀非js文件需要在命令中明确后缀名
node ./serverjs/lowdb/bin/index.mjs
问题解决!!!
