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">

现在，在开发工具中，它正在寻找styles.less中http://localhost:3845/less/styles.less的{{1}}，因为只有/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文件中。

较少的SourceMap文件位置相对于文件系统，而不是网站

1 个答案: