javascript - 相对于文件系统而不是网站的更少 SourceMap 文件位置

Question

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

/less/
     /styles.less
/public/
       /css/
           /styles.css
           /styles.css.map
       /images/
       index.php
/gruntfile.js

Gruntfile.js：

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

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

现在在开发工具中，它正在寻找不存在的 in ，因为它只styles.less暴露给网站。http://localhost:3845/less/styles.less/public/

它曾经将文件正确映射到我的本地计算机，无需任何额外步骤，但现在不再如此。我不确定发生了什么或如何设置它。

我正在使用最新的 grunt-contrib-less (1.0.0)。

Answer 1

浏览器无法读取 less 文件夹，因此将您的 Less 文件删除到您的公共文件夹（或授予 Web 服务器访问该less文件夹的权限）

或者设置 Less 的source-map-less-inline 和source-map-map-inline选项：

options: {
sourceMap: true,
sourceMapFileInline: true,
outputSourceFiles: true
}

上面将带有您的 Less 文件内容的地图放入 CSS 文件中。