node模块导入异常 SyntaxError: The requested module ‘/xxx.js‘ does not provide an export named ‘xxx‘ 解决方方法

在node中导入自定义的模块中的方法时提示  vue-router.esm-bundler.js:3302 SyntaxError: The requested module '/src/utils/request.js?t=123' does not provide an export named 'service' (at parser.js?t=123:1:9)

异常代码:

import {service,rmCache} from '@/utils/request'

我们的request.js文件中是这样定义的, 在这个文件里面我们定义了一个导出函数 rmCache 和一个默认的导出 service, 这个service是我们创建的一个axios对象

// 创建axios实例
const service = axios.create({
  // axios中请求配置有baseURL选项,表示请求URL公共部分
  baseURL: import.meta.env.VITE_APP_BASE_API,
  // 超时
  timeout: 10000
})

// 通用缓存清理方法
export function rmCache(prefix) {
    //.....省略
}

export default service

导致异常的原因

对于模块中定义的默认导出对象 export default xxx  不能使用命名导入的方式来导入

解决方法

将导入代码改为这样即可

// 导入默认的 export default ,注意这里的service是export default的别名,可以是任何你想要的名字,和request.js中你定义的默认导出对象名称无关!
import service from '@/utils/request'

// 命名导入方式,这里导入的是你在模块中使用 export function xxx定义的函数,有多个可使用逗号分隔,如 { rmCache, download }
import {rmCache} from '@/utils/request'

总结:

        node模块化开发里面导出的 export function xxx和 export default XXX 他们在导入的时候需要使用不同的导入方法,对于 export default XXX 由于这里的XXX 对象他实际上就类似是一个匿名的对象,所以在你使用import导入的时候 名称是可以由你自己随意的命名,故他不能使用命名方式导入, 而是应该将他单独作为一行来导入 ,即 import  abc from '模块名' 这里的abc名称你可以随意定义,他代表的就是你在模块里面使用 export default 导出的对象。

   而我们在模块里面使用 export function xxx 导出的函数,在使用import 导入的时候我们就应该使用命名方式导入,且导入的名称必须要和你在模块里面导出的名称一致。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

tekin

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值