ModuleJS 与 CommonJS 混用的两种解决方案

目录

方案一

方案二

[统一使用 ModuleJS](#统一使用 ModuleJS)

统一使用CommonJS

方案一

使用构建工具,webpack、vite等系列构建工具。这些构建工具底层则会将两种不同的系统模块语言转为同一种语言,然后代码也能正常执行。

方案二

如果你可以修改文件的文件后缀,那么就不需要借助任何第三方工具,直接这样做即可。

统一使用 ModuleJS
  • 文件扩展名为 .mjs
  • require 替换为 import
  • package.json 中设置 "type": "module"
javascript 复制代码
// const qrcode = require('qrcode-terminal')
import * as qrcode from 'qrcode-terminal'

qrcode.default.generate()
统一使用CommonJS
  • import 替换为 require
  • 确保文件扩展名为 .cjs
  • package.json 中设置 "type": "commonjs"
javascript 复制代码
const qrcode = require('qrcode-terminal')

qrcode.default.generate()
相关推荐
会跑的葫芦怪11 小时前
若依Vue 项目多子路径配置
前端·javascript·vue.js
xiaoqi92212 小时前
React Native鸿蒙跨平台如何进行狗狗领养中心,实现基于唯一标识的事件透传方式是移动端列表开发的通用规范
javascript·react native·react.js·ecmascript·harmonyos
jin12332213 小时前
React Native鸿蒙跨平台剧本杀组队消息与快捷入口组件,包含消息列表展示、快捷入口管理、快捷操作触发和消息详情预览四大核心功能
javascript·react native·react.js·ecmascript·harmonyos
烬头882114 小时前
React Native鸿蒙跨平台实现二维码联系人APP(QRCodeContactApp)
javascript·react native·react.js·ecmascript·harmonyos
pas13614 小时前
40-mini-vue 实现三种联合类型
前端·javascript·vue.js
2601_9498333915 小时前
flutter_for_openharmony口腔护理app实战+预约管理实现
android·javascript·flutter
军军君0116 小时前
Three.js基础功能学习十三:太阳系实例上
前端·javascript·vue.js·学习·3d·前端框架·three
xiaoqi92217 小时前
React Native鸿蒙跨平台如何实现分类页面组件通过searchQuery状态变量管理搜索输入,实现了分类的实时过滤功能
javascript·react native·react.js·ecmascript·harmonyos
qq_1777673717 小时前
React Native鸿蒙跨平台实现应用介绍页,实现了应用信息卡片展示、特色功能网格布局、权限/联系信息陈列、评分展示、模态框详情交互等通用场景
javascript·react native·react.js·ecmascript·交互·harmonyos
2603_9494621017 小时前
Flutter for OpenHarmony社团管理App实战:预算管理实现
android·javascript·flutter