问题标签 [gulp-sourcemaps]

[已修复] - 见帖子底部

我不确定它们是否不受支持，或者我做错了什么。我注意到它删除了属性周围的引号，我不知道它是如何或为什么这样做的，但也许这可能导致问题？

在此示例中，我使用了子字符串匹配选择器方法，但它不起作用。它指向生成的样式表：

在此示例中，我不再使用子字符串匹配选择器方法，它可以工作：

我正在为我的工作流程使用 gulp，这是处理我的 SASS 的任务：

编辑：自从我在 Chrome 开发人员工具中恢复默认设置后，此问题已自行解决。不过，我会留下这个问题，因为我实际上并不知道是什么原因造成的。

此外，似乎只有元素检查器删除了引号，引号仍然存在于实际源代码中。

我已经安装了 gulp-sass 和 gulp-sourcemaps，我可以在以下位置看到文件夹：node_modules。

我的 gulpfile 在这里：

当我运行“gulp watch”并保存我的 scss 文件时，我收到此错误：

有什么想法我哪里出错了吗？

谢谢

我试图让 gulp 编译我的 SASS 文件并将它们输出到相同的源目录但是我无法让它正常工作，我尝试使用该base选项：

使用上面的代码，它只是输出到应用程序根目录，即当前工作目录，有什么想法可以让它工作吗？我希望它如何工作的一个例子是有一个Application/modules/frontend/static/css/main.scss文件，并将其编译为Application/modules/frontend/static/css/main.css和Application/modules/frontend/static/css/main.css.map.

我在 Gulp 中有一个任务，可以在 css 中编译一个 less 文件。我想用源图输出非缩小和缩小版本。我找不到解决办法。这是我应该完成这项工作的实际任务：

我收到一个错误，因为 cssnano 想要缩小地图文件。有人可以使用该功能发布他的完整任务吗？

先感谢您！

我对 gulp 很陌生，所以我有点磕磕绊绊。直到我想将源映射添加到我的项目中之前我都很好，现在我的 gulp 在运行默认任务后卡住了，并且似乎永远不会启动我的“css”任务。因为，我没有收到错误（我的 gulp 任务只是停滞不前）我无法缩小文件的问题范围。这是我的 gulpfile 代码和终端中正在发生的事情的图片。我已经等了整整 5 分钟，它才能启动“css”并抛出错误，但没有任何进展。

作为一个编辑说明，我确实更改了我的 sass 文件，以便它会触发“css”任务来更新我的样式。我仍然遇到同样的问题，它在运行默认任务并且没有启动“css”后被卡住。

终端窗口

所以我正在运行一个 gulp 设置（远程服务器），它在正确的目录中创建源映射，将 sourceMappingURL （链接到正确的映射）添加到我的 css 文件，并在我的 css.map 中写入正确的 sourceRoot。

但是，当我检查我的元素样式时，它仍然指向已编译的 css 文件。（而不是 source.scss 文件）

这是我的目录结构：

开发-
| |
| scss -
| |
| main.scss
产品-
        |
        css -
               |
                 main.css
                 main.min.css
                 main.min.css.map

我的源映射 urlmain.min.css是：sourceMappingURL=main.min.css.map
源根main.min.css.map是："sourceRoot":"../../dev/scss"


我的 gulp 函数如下所示：

有人知道为什么我的页面检查器没有将我指向源 .scss 文件吗？而是将缩小的 .css 显示为源？

所以我有以下任务：

这就像它应该的那样工作，它会在 css 文件旁边生成地图文件。在 css 文件中，底线如下：

但是 chrome 和 Firefox 会加载到该地图文件中。难道我做错了什么？还是有什么不工作？

尽管具有类似任务的 JS 文件确实在我的 devTools 的源选项卡中拆分了 js

我一直在为我正在使用的一个项目做 sourceComments，并且在 CSS 中输出的评论以便我可以找到正确的 scss 文件显示与我的计算机相关的路径

例如

我希望这是

当这是我的 gulpfile.js 时，我将如何完成此操作（此处显示 sass 函数）

我有这个 gulp 设置

我的结构如下

一切都按预期构建，除了我的所有 .map 文件都引用 Content/v2.0 目录中的 .css 而不是 dev 文件夹中的 .scss 文件。

我对源映射的理解是，它应该指向原始文件（即 scss）中的行号，以便于调试。

我该如何解决这个问题或者我错过了什么？

更新

所以我意识到我错过了 sourceRoute 但是因为我的 sass 被分解成几个级别深的目录中的数百个文件，浏览器仍然没有拾取地图，因为路径读取“../../ui-dev/ scss”在所有地图中。

如何获得每个源文件的正确路径？

我正在为Appium设置调试环境，这是一个带有 gulpfile 的 nodejs 应用程序。我能够运行gulp transpile在 build/lib 中生成 .js 文件的程序。现在在设置断点时，我需要在 build/lib/*.js 中设置断点，而不是在原始的 lib/*.js 源文件中设置断点。我安装了 gulp-sourcemaps并编写了一个任务来生成生成 .js.map 文件的 sourcemaps。

在这一点之后我被困住了。生成的文件gulp transpile不知道这些源映射。而且我不想//# sourceMappingURL每次使用gulp transpile. 那么如何让我的编辑器（Visual Studio 代码）使用这些映射文件并让我在原始源中放置断点而不是生成的构建文件？

我查看了https://code.visualstudio.com/docs/editor/debugging#_node-debugging但不能完全让调试器使用我编写的任务使用 gulp 生成的源映射。

谢谢你的帮助！