问题标签 [gulp-sourcemaps]

我正在尝试使用 gulp 为丑陋的 javascript 生成源映射文件。我的任务如下所示：

生成的输出映射gulp-sourcemaps包含一个空names数组，这会阻止浏览器将函数参数还原为其原始名称。

在我看来，gulp-sourcemaps没有正确合并链接的地图文件？gulp-concat不输出names属性（它不需要：它只是连接）但是gulp-uglify：

以上确实生成了具有names属性集的正确地图文件。

我做错了什么还是有人有解决方法？

我正在尝试执行以下操作：

1. 合并所有 CSS 文件（jQuery 插件）
2. 合并媒体查询
3. 缩小 CSS
4. 编写 sourcemap

之后我尝试在不同的文件夹中做其他事情

1. 少翻译
2. 合并媒体查询
3. 缩小生成的 CSS
4. 编写 sourcemap
5. 自动前缀的东西

看起来像这样：

我唯一的问题是生成的源映射是错误的，并且总是引用错误的 LESS 文件。

我使用以下库来实现这一点：

• 吞咽连接
• 少吞咽
• gulp-autoprefixer
• gulp-combine-media-queries
• gulp-sourcemaps
• gulp-minify-css

我知道如果我省略了供应商的东西，它会起作用，但我希望只有一个结果样式表。

感谢您的每一个建议！

我的 /less 文件夹中有两个 LESS 文件：

main.less:

和 vars.less

我的 gulp 任务使用 gulp-less 和 gulp-sourcemaps

CSS 生成（在 /public/main.css）工作正常，但在源映射中，我只能看到 main.less，而不是 vars.less。任何的想法？提前致谢

我在我的 gulpfile.js 中尝试了这个：

但我总是收到这样的消息：

我在所有较少的文件中使用@imports，并且引用是那些在消息中未找到的引用。例如，我的 widgets.less 文件如下：

我错过了什么吗？在此先感谢您的帮助！

我有一个相当标准的用例gulp-sourcemaps

https://github.com/floridoo/gulp-sourcemaps

这会产生适当连接和丑化的文件。但是，它们没有添加源地图。bundle.src是一个文件路径数组。不知道如何调试这个。

这个周末我开始玩 gulp。我想设置一个可以

• 编译我的 sass 文件
  • 如果我在 sass 文件中出错，请继续工作
  • 使用 sass Bootstrap
• 生成源图
• 附加浏览器前缀
• 在浏览器重新加载的情况下注入已编译的 css
• 快速（开发环境中 1-2 秒）

我完成了大部分步骤，但浏览器前缀让我很难过这是我到目前为止所得到的

问题是自动前缀给了我一个错误并弄乱了源映射

我得到的错误：“gulp-sourcemap-write：找不到源文件：C:\WEB\skilldrill_v1\skilldrill\sass\app.css”

所以出于某种原因，它试图在 sass 目录中找到 css 文件

[编辑]
我设法找到了问题，但还没有解决。这个东西工作的管道：gulp-autoprefixer -> 做一些事情 -> 前缀任务 -> 乙烯基-sourcemaps-apply

gulp-autoprefixer\index.js第35行：applySourceMap(file, res.map.toString()); 从这一点开始，vinyl-sourmaps-apply 了解当前文件（在我的例子中为 app.css）也成为了一个源。

以下是问题：a) 它认为 css 文件与 gulp.src() 中指定的文件夹位于同一文件夹中，这通常不是真的 b) 它不仅适用于 autoprefixer 添加的行，而是添加了引用到每一行

您对这些信息有什么想法吗？我开始挖掘 gulp-concat 可以正确处理类似问题。

这是我正在使用的任务的简化版本：

（这是Coffeescript，但Javascript几乎相同。如果上面难以解析，我可以提供JS。）

运行上述内容时，gulp-sourcemaps 会抛出：

换句话说，它在 Font Awesome 目录中寻找 Bootstrap 的文件。我尝试使用 gulp-if 代替 gulp-filter，但同样的错误也失败了。

编写此任务的正确方法是什么？

我有一个简单的较少任务的 gulp 工作流程，如下所示：

我希望gulp-sourcemaps模块在我的 CSS 文件中将源映射显示为内联注释。但是每当 gulp 编译我的 LESS 时，gulp-sourcemaps 不会显示我的源文件的路径。相反，它显示如下内容：

我极大地简化了我的 gulpfile，删除了 livereload、autoprefixer 等。但即使在这个精简的版本中，我也无法让源 URL 正确。

已经处理这件事很长一段时间了，任何帮助将不胜感激！

有人可以解释如何使用 gulp 进行 uglify、concat 并最终生成源映射吗？我似乎无法让它工作。我在 API 中没有看到任何关于此的内容，但在我看来应该支持它。重点是生成源映射并在设置断点时使用源文件。我尝试将第concat一个放在下面的代码中，但是当我这样做时，断点在 chrome 浏览器中不起作用。

我正在使用
concat = require('gulp-concat'),和uglify = require('gulp-uglify')。

我正在尝试将应用程序从 Grunt 构建移动到 Gulp。我的 Gulp 构建生成了一个 ionic.css 文件，我尝试在我的 index.html 中使用链接标签加载该文件。我在我的 chrome 检查器中收到一个错误，即在该路径中找不到该文件，即使我可以在我的 www 文件夹中看到它。

我的代码

gulp-sass 任务

index.html 头

我的目录结构