8

我希望能够在我的生产站点上调试缩小的压缩 javascript 代码。我们的网站使用 django 压缩器来创建缩小和压缩的 js 文件。我最近读到了 chrome 能够使用源映射来帮助调试此类 javascript。但是我不知道如何/如果可能的话告诉 django 压缩器在压缩 js 文件时创建源映射

4

3 回答 3

4

关于输出单独的源映射文件，我没有一个好的答案，但是我能够进行内联工作。

在添加源映射之前，我的 settings.py 文件使用了以下预编译器

COMPRESS_PRECOMPILERS = (
    ('text/coffeescript', 'coffee --compile --stdio'),
    ('text/less', 'lessc {infile} {outfile}'),
    ('text/x-sass', 'sass {infile} {outfile}'),
    ('text/x-scss', 'sass --scss {infile} {outfile}'),
    ('text/stylus', 'stylus < {infile} > {outfile}'),
)

快速后

$ lessc --help

您会发现可以将 less 和 map 文件放入输出的 css 文件中。所以我的新文本/少预编译器条目看起来像

('text/less', 'lessc --source-map-less-inline --source-map-map-inline {infile} {outfile}'),

希望这可以帮助。

编辑：忘记添加，为此需要 lessc >= 1.5.0，以升级使用

$ [sudo] npm update -g less
于 2013-12-04T20:25:35.427 回答
0

虽然我无法让它与 django-compressor 一起使用（尽管应该是可能的，但我认为我只是在正确设置应用程序时遇到了问题），但我能够让它与django-assets一起使用。

您需要将适当的命令行参数添加到 less 过滤器源代码，如下所示：

diff --git a/src/webassets/filter/less.py b/src/webassets/filter/less.py
index eb40658..a75f191 100644
--- a/src/webassets/filter/less.py
+++ b/src/webassets/filter/less.py
@@ -80,4 +80,4 @@ class Less(ExternalTool):
     def input(self, in_, out, source_path, **kw):
         # Set working directory to the source file so that includes are found
         with working_directory(filename=source_path):
-            self.subprocess([self.less or 'lessc', '-'], out, in_)
+            self.subprocess([self.less or 'lessc', '--line-numbers=mediaquery', '-'], out, in_)

除了那个微小的补充：

  1. 确保您的路径中有可用的节点——而不是 ruby​​ gem——更少的编译器（>=1.3.2 IIRC）。

  2. 打开隐藏在 chrome 的 web 检查器配置页面中的 sass source-maps 选项。（是的，'sass' 不少：less 调整了它们的调试信息格式以匹配 sass，因为 sass 已经实现了与 chrome 兼容的映射，并且它们的格式一开始并没有什么不同......）

于 2013-02-02T03:53:50.900 回答
-1

不是开箱即用，但您可以扩展自定义过滤器：

from compressor.filters import CompilerFilter

class UglifyJSFilter(CompilerFilter):
        command = "uglifyjs -c -m " /
            "--source-map-root={relroot}/ " /
            "--source-map-url={name}.map.js" /
            "--source-map={relpath}/{name}.map.js -o {output}"
于 2013-06-04T18:20:34.530 回答