如何引用缩小的代码，但继续使用 JavaScript 开发

Posted 2023-03-08

【中文标题】如何引用缩小的代码，但继续使用 JavaScript 开发

【英文标题】：How to reference minified code, but keep developing in JavaScript

【发布时间】：2014-10-15 16:30:53

【问题描述】：

我们的 index.html 引用了大约 25 个 javascript 文件。对于部署，我们需要缩小所有这些，因此我们必须将 index.html 引用更新为缩小版本。

当我们回到开发时，我们必须使用一个类似的 index.html 文件，但要引用非缩小的 javascript 文件。有没有一种最佳实践方法来实现这一点，而不必保持两个 index.html 文件同步，一个用于开发，一个用于部署？

【问题讨论】：

这个问题是主观的，所以它是题外话，但你为什么不能保持相同的 js 文件名？开发服务器上的 x.js 将指向非缩小文件，而生产服务器上的 x.js 将指向缩小副本，前提是您在生产服务器上加载了该文件。

【参考方案1】：

答案是 Source Maps，它基本上是一种将缩小的 javascript 文件引用回未构建状态的方法。

这样你只需要一个 index.html 文件来引用你缩小的 javascript 文件，源映射将帮助你调试它们，就好像它们没有被缩小一样。

这是一个真正帮助我的链接。

http://www.html5rocks.com/en/tutorials/developertools/sourcemaps/

您还可以使用gulp 或grunt 等工具来更轻松地缩小和构建源映射。