$export is not a function debug笔记

背景

webpack打包文件时,$export is not a function 其实并不算是一个少见的错误,具体体现为js打包后引入,浏览器报类似如下错误:


导致这个问题的原因很多,我这边是因为将旧项目的其中一部分组件迁移至另外一个项目(事后想想,其实这才是我这次问题的根本原因,😅)。

解决方案

  • 1 babel编译去除node_mocules
    这是最主流的一种解决办法,通过修改webpack配置文件,去除babel-loader对node-modules的编译,如下图:

    通常这一步90%可以解决你的问题了,可惜的是我的问题并没有解决!(⊙﹏⊙)
  • 2 检查依赖
    方法1试过之后未果,然而由于方法1的引导,一直以为是webpack配置问题(因为两个项目中用的webpack版本不同),因此在打包配置上寻寻觅觅了好久,可惜实在没有发现什么突破点。
    最后突然想到,还有一个终极debug大法没用,排除法,😅!,于是我把迁移过来的组件内容全部去掉,只留最基础的vue结构,果然没问题!接下来就简单了,一个一个import往里面加,最终果然找到罪魁祸首子组件。下面继续一行一行注释去找根源文件,最后终于发现,竟然是一个依赖没有引入!!!蠢得无可附加了(⊙﹏⊙),最终解决方案就是引入了这个依赖,这个问题就解了。整个过程就是这么狗血,而且比较奇怪的是,并不是所有依赖都会导致这个问题,我手动删掉其他依赖测试,并不会导致这个问题,后续会继续研究研究,有结果再更!
    总结就是,如果上面的方法1没用,你可以检查下你的依赖,是否所有依赖都已经安装引用到位!
  • 3 循环依赖检查
    如果上面两个方法都没用,可以尝试检查下自己代码中是否有循环依赖,到这一步,只能祝你好运了!

The End

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容