module “**.vue“ has not default

11 篇文章 0 订阅

module “**.vue” has not default

这个问题造成的原因是因为你在vue.config.js中设置了happyPackMode选项,如下所示:

config.module
      .rule('ts')
      .use('ts-loader')
      .loader('ts-loader')
      .tap(options => {
        Object.assign(options || {}, {transpileOnly: false, happyPackMode: false, appendTsSuffixTo: [/\.vue$/]})
        return options
      })

把happyPackMode设置为true就好了
但是你一旦将happyPackMode设置为true你会发现你的vue3打成包后没有自动声明的文件

vue3.0打包自动生成声明文件

vue3.0打包没办法自动生成声明文件,必须将happyPackMode设置为false才可以
vue.config.js

config.module
      .rule('ts')
      .use('ts-loader')
      .loader('ts-loader')
      .tap(options => {
        Object.assign(options || {}, {transpileOnly: false, happyPackMode: false, appendTsSuffixTo: [/\.vue$/]})
        return options
      })

tsconfig.ts

"declaration": true,
 "declarationDir": "dist",
 "typeRoots": ["./src", "./node_modules/@types"],

二者冲突了怎么办呢

本人的解决方案如下:

// eslint-disable-next-line
// @ts-ignore
import example from './example/index.vue';

其实module “**.vue” has not default包错不会影响打包的效果,如果不想看到直接disabled,简单粗暴

其它

1.vue3项目使用子项目组件,提示子项目组件的setup为异步,我tm子项目组件的setup明明是同步啊,目前我的解决方案是打包后基于npm包引入的方式使用,有人知道原因可以评论告诉我。
2.vue3项目打包后,其它项目使用npm link引入发现声明文件没有生效,我的解决方式是将打包好的vue3项目先发布到npm仓库中,然后在其它项目中通过npm install的方式引入(这个时候发现声明文件生效了)。在vue3项目中使用npm build --watch --dest 其它项目/node_modules/****/dist命令,每次修改vue3项目时自动打包覆盖node_modules中的dist文件。

有人拥有更好的解决方案也可以评论告诉我。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值