Question

我有一个看起来像这样的文件结构（简化为简洁）：

/less/
     /styles.less
/public/
       /css/
           /styles.css
           /styles.css.map
/gruntfile.js

Gruntfile.js：

less: {
    options: {
        sourceMap: true,
        sourceMapFilename: 'public/css/styles.css.map',
        sourceMapURL: 'less/styles.less'
    }
    files: {
        'public/css/styles.css': 'less/styles.less'
    }
}

在html文件中：<link rel="stylesheet" href="/css/styles.css">

现在的问题是，在开发工具中，styles.less指向/css/less/styles.less。这显然不对，因为它应该是/less/styles.less。但我似乎可以指向项目根目录。

我没试过sourceMapBasepath和sourceMapRootpath选项。

思想？

另一件事是在我的css文件（/css/styles.css）中，我得到了这个：

/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjp... */

为什么它是base64输出？我认为应该只指向styles.css.map文件。

Answer 1

使用grunt-contribe-less 1.0.0

以下任务

less: {
    options: {
      sourceMap: true,
      sourceMapRootpath: '/'

    },
    files: {'css/t.css' : 'less/t.less'}
  }

}

生成css/t.css和css/t.css.map。最后一个文件将自动生成，无需设置sourceMapFilename。

以上内容不会生成内联源映射（使用base64输出）。

css/t.css以：

结束

/ *＃sourceMappingURL = css / t.css.map * /

可能取决于您的grunt-contrib-less版本，另请参阅Does grunt-contrib-less support --source-map-map-inline?（描述内联源地图）

~~阅读：https://github.com/gruntjs/grunt-contrib-less~~

将sourceMapBasepath设为/。


为什么它是base64输出？我认为它应该只指向   styles.css.map文件。

-


sourceMapFilename

类型：字符串默认值：无

将源地图写入具有给定文件名的单独文件。

<击>

使用Grunt减少SourceMap绝对文件路径

1 个答案: