Question

使用Google Closure Compiler缩小一堆javascripts。现在，我还要将源地图添加到那些要在野外进行调试的源地图。

事情是，我想将原始（并且最好也是地图文件）保存在一个完全不同的地方，就像另一台服务器一样。我一直在寻找解决方案，并找到sourceRoot参数。但它似乎不受支持？

还找到了这个--source_map_location_mapping参数，但没有任何文档。似乎它想要一个以管道分隔的参数（filesystem-path|webserver-path）。尝试了几种不同的方法，如local filename|remote url，但没有占上风。这只是给了我No such file or directory和java.lang.ArrayIndexOutOfBoundsException。

是否有人成功将缩小/映射的源文件放在远程计算机上？

或者有人知道--source_map_location_mapping的任何文档吗？

Answer 1

标志的格式应如下：

--source_map_location_mapping=foo/|http://bar

如果您需要多个位置，则应重复该标志：

--source_map_location_mapping=foo/|http://bar --source_map_location_mapping=xxx/|http://yyy

但我期待你遇到的是“|”可能由您的命令shell解释。例如：

echo --source_map_location_mapping=foo/|http://bar
-bash: http://bar: No such file or directory

（选择使用“|”是不幸的）。确保它被适当地转义。像：

--source_map_location_mapping="foo/|http://bar"

我提交了一个拉取请求来报告格式错误的标记值的错误：

https://github.com/google/closure-compiler/pull/620

至少你知道你的标志值是不正确的（所以你不会看到越界异常）。

Answer 2

John在功能方面是正确的，但我想我可以稍微清理一下（因为这对我来说非常混乱）。

我怀疑很多人和我有同样的问题：

相对于当前目录生成源地图网址
他们不一定要与您网站/服务器上的相对网址匹配
即使他们确实直接匹配，奇怪定义的伪规范found here也意味着Chrome / Firefox会尝试相对于您的源地图加载路径。即浏览器加载/assets/sourcemaps/main.map，查看assets / js / main.js，并加载/assets/sourcemap/assets/js/main.js（yay）。（或者它实际上可能与原始js文件有关，我碰巧将它们放在同一目录中）。

让我们使用上面的例子。假设我们的sourcemap中有assets / js / main.js，并希望确保加载mywebsite.com/assets/js/main.js。为此，您可以通过以下选项：

--source_map_location_mapping="assets|/assets"

就像John提到的那样，引号很重要，并且多次重复arg以获得多个选项。前缀/将让Firefox / Chrome知道您希望它相对于您的网站根目录。（如果你在grunt-closure-tools这样的事情中这样做，你需要逃避更多：

config:{
    source_map_location_mapping:"\"assets|/assets\"",
}

这样，我们基本上可以将任何给定的源映射路径映射到任何给定的网站路径。它并不是某种封闭源根的完美替代品，但它确实允许您将源的每个部分单独映射到它们自己的根，所以它并不是一个妥协，并且确实给出了一些额外的灵活性（即您可以为某些资产指定一些cdn路径，但不为其他资产指定。）

您可能会发现有用的其他内容，您可以通过output_wrapper自动添加sourceMappingURL。（但是，如果你想要在生产中调试的能力，你应该更喜欢一些使服务器返回X-Sourcemap的能力：相反，blah.js.map标题，公众无法访问）

--output_wrapper="(function(){%output%}).call(this); //# sourceMappingURL=/assets/js/my_main_file.js.map"

Answer 3

幸运的是，Google Closure Compiler的源代码可以公开获取

https://gist.github.com/lydonchandra/b97b38e3ff56ba8e0ba5

REM --source_map_location_mapping is case SENSITIVE !
REM need extra escaped double quote   --source_map_location_mapping="\"C:/tools/closure/^|httpsa://bla/\"" as per http://stackoverflow.com/a/29542669
java -jar compiler.jar --compilation_level=SIMPLE_OPTIMIZATIONS --create_source_map=C:\tools\closure\latest\maplayer.js.map --output_wrapper "%output%//# sourceMappingURL=maplayer.js.map"  --js=C:\tools\closure\mapslayer.js --js_output_file=maplayer.min.js --source_map_location_mapping="\"C:/tools/closure/^|httpsa://bla/\""

使源映射引用远程计算机上的原始文件

3 个答案: