怎么排查出 js 文件的引用冲突？（页面引入了各种不同的外部 js）

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

推荐关注

› Meteor

› JSLint - a JavaScript code quality tool

› D3.js

推荐书目

› JavaScript 权威指南第 5 版

这是一个创建于 1367 天前的主题，其中的信息可能已经有所发展或是发生改变。

在一个页面 A 中，引入了第三方库需要的 js 文件，但是，应用全局又引入了其他库所需别的 js 文件。

现在出现的问题是：

A 页面单独引入第三方库，是正常的。加入了应用全局引入的别的 js 文件，就不能用了。

怎么排查出 A 页面中引入的 js 和应用全局引入的某个 js 发生了冲突？

7 条回复 • 2021-03-05 13:18:00 +08:00

smallgoogle

2021-03-05 10:55:10 +08:00

看报错。一般都是命名冲突或者是 onload

DOLLOR

2021-03-05 11:18:18 +08:00

看控制台呀，是多个 JS 之间全局变量冲突，还是引用的 JS 框架、库版本冲突，还是用了黑魔法导致翻车的。

lisisi

2021-03-05 11:22:23 +08:00

@smallgoogle 就是因为不报错，貌似是全局变量直接覆盖了😓 第三方库封装的太黑盒，打断点去看要眼瞎了，加载顺序调整一下都不行，依赖太紧密了

no1xsyzy

2021-03-05 11:25:34 +08:00

那你可能只能用打包工具了。幸好，目前看来 rollup 对于已经可以运行的代码进行简单打包比 webpack 方便得多，并且对代码的修改几乎无感。

lisisi

2021-03-05 11:29:01 +08:00

@DOLLOR 看了下加载顺序，猜测是应用全局的 js 和当前页 A 引入的 js 加载顺序导致的问题。

lisisi

2021-03-05 11:30:41 +08:00

@no1xsyzy 也只好这样试试，外部引入的多了，不是同一个开发负责更加不容易协调啦

lihongming

2021-03-05 13:18:00 +08:00 via iPhone

js 打断点太痛苦了，99.99%的代码都是在做界面特效，跟踪了半小时，一个转场动画还没跑完呢。快进至下一个断点吧，结果问题错过去了