我有一个看起来像这样的文件结构(为简洁起见进行了简化):
/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
,这不存在,因为只有/public/
暴露在网站上。
它曾经将文件正确映射到我的本地计算机,无需任何其他步骤,但现在不再了。我不确定发生了什么或如何设置它。
我正在使用最新的无咕噜声 (1.0.0)。
浏览器无法读取 less 文件夹,因此请将 Less 文件删除到公用文件夹(或授予 Web 服务器对 less
文件夹的访问权限)
或者设置"less"source-map-less-inline
和source-map-map-inline
选项:
options: {
sourceMap: true,
sourceMapFileInline: true,
outputSourceFiles: true
}
上面将映射与 Less 文件的内容一起放入 CSS 文件中。