将JavaScript脚本绑定到各自的网页

Bind JavaScript scripts to their respective web pages

本文关键字:网页 JavaScript 脚本 绑定      更新时间:2023-09-26

我正在开发一个大型web应用程序,该应用程序有大约10K行JavaScript代码(不考虑第三方库)。为了加快页面加载速度,已决定将每个脚本文件自动连接到一个大型脚本中,该脚本在首次访问应用程序时加载(并缓存)到客户端。这带来了一个问题,因为每个页面都有自己的脚本,其中包含(本质上)相同函数所需的所有JavaScript
现在,如果其中一个脚本中发生错误,那么很难判断错误是从哪里来的,因为所有内容都被滚动到添加到每个页面的同一脚本中,而不是像以前那样在每个页面中使用显式script声明
有没有JavaScript模式可以解决这个问题?我正在考虑类似AngularJS模块的东西,它可以绑定到web应用程序页面中的某些容器
然而,我想要一个简单的、自定义的解决方案,因为我们时间紧迫,而且没有时间在应用程序中实现框架。它应该只将某些脚本(模块)应用于它们各自的页面,并且应该允许开发人员显式声明某些脚本所依赖的任何其他脚本(模块。
此外,实现一个异常处理系统来通知用户(例如,在Firebug控制台中)异常源自哪个模块(如果页面的模块依赖于其他模块)也很棒。有没有一种通用的方法来解决JavaScript中的此类问题(不依赖于框架)?

问题的一个可能解决方案是使用js源映射。许多concat/minify/uglify工具直接支持这一功能,而大多数现代浏览器都能够解释它们。

您仍然可以提供一个包含所有代码的JS文件(即使这很可能不是处理如此大量代码的最佳想法,这在很大程度上取决于您的整体架构)

但是您的浏览器开发工具现在可以向您显示错误/控制台输出等的原始文件名和行号。

您很可能不会在生产中提供源映射文件。

进入js源代码映射的一个好地方是这个wiki。