The symbol "h" has already been declared

记一次bug,项目使用了unplugin-auto-import,当我引入一个已经打包了的vue组件后(这个组件其实是我写的),控制台报错The symbol "h" has already been declared

字面意思是h被重复定义了,出错的原因是这个打包的组件内部定义了一个h,因为unplugin-auto-import插件在外部也会自动引入vue 的h函数,网上搜索的答案也很简单,不要自动引入h函数了

js 复制代码
 AutoImport({
      ignore: ['h'],
      })

确实可以解决问题,大不了我手动一个一个引入h,就是有点麻烦,于是乎看unplugin文档,似乎可以配置忽略文件,于是再加一行配置搞定

js 复制代码
 AutoImport({
      ignore: ['h'],
      exclude: [/libs/], //将需要排除h引入的组件都放入libs目录下
      })

这样其他文件不受影响,还能享受自动引入的快乐,有一点麻烦的是我需要叫团队成员开个会,告知他们我加了一个libs文件夹,以及哪些文件需要放到这里才能正常运行,于是继续寻找简单一点解决方案,能不能不让打包的组件库出现这个h变量.

于是翻看h出现的地方,有点眼熟

js 复制代码
var d = function(C, H) {
  return f.call(C, H);
}, h = Number.isInteger || function(C) {
  return typeof C == "number" && isFinite(C) && Math.floor(C) === C;
}, b = Array.isArray || function(C) {
  return a.call(C) === "[object Array]";
}, O = function(C) {
  return a.call(C) === "[object Function]";
}, g = function(C) {
  return s(C) && d(C, "_vueTypes_name");
}, m = function(C) {
  return s(C) && (d(C, "type") || ["_vueTypes_name", "validator", "default", "required"].some(function(H) {
    return d(C, H);
  }));
};

看起来像是一个判断类型工具函数,其实就是vue-types库,那么能不能不打包这个库呢,反正我的项目也是vue,将来一起打包也不迟,遂尝试添加打包选项

js 复制代码
rollupOptions: {
      external: ['vue', 'vue-types'],
      output: {
        globals: {
          vue: 'Vue'
        }
      }
    },

嘿,h果然不见了,下班!!!

相关推荐
chxii7 分钟前
10.4FormData :前端文件上传与表单数据处理的核心工具
前端
AntBlack33 分钟前
不当韭菜 : 好像真有点效果 ,想藏起来自己用了
前端·后端·python
楊无好39 分钟前
react中props的使用
前端·react.js·前端框架
一个处女座的程序猿O(∩_∩)O1 小时前
Vue-Loader 深度解析:原理、使用与最佳实践
前端·javascript·vue.js
一点一木1 小时前
火山方舟 Responses API 实战指南:从概念到「公司尽调 Dossier 生成器」
前端·人工智能·api
还是大剑师兰特1 小时前
TypeScript 面试题及详细答案 100题 (91-100)-- 工程实践与框架集成
前端·javascript·typescript·1024程序员节
用户47949283569151 小时前
typeof null === 'object':JavaScript 最古老的 bug 为何 30 年无法修复?
前端·javascript·面试
__WanG2 小时前
如何编写标准StatefulWidget页面
前端·flutter
非凡ghost2 小时前
By Click Downloader(下载各种在线视频) 多语便携版
前端·javascript·后端
非凡ghost2 小时前
VisualBoyAdvance-M(GBA模拟器) 中文绿色版
前端·javascript·后端