Tag: gulp sourcemaps

将gulp-sourcemaps与gulp-csso和gulp-sass结合在一起: 我试图让我的gulpfile.js这部分工作： gulp.task('compileSass', function() { return gulp.src(folders.src+'/scss/*scss') .pipe(sass()) .pipe(gulp.dest(folders.dest+'/css')); }); gulp.task('minifyStyles', ['compileSass'], function() { return gulp.src(folders.dest+'/css/style.css') .pipe(maps.init()) .pipe(minCss({ sourceMap: true })) .pipe(maps.write('./')) .pipe(rename('style.min.css')) .pipe(gulp.dest(folders.dest+'/css')); }); 我想开发工具来显示.scss文件。我不确定是否与rename()或者我在错误的时间调用了我的源代码，但是当我检查开发工具时，源代码始终是style.min.css 。

gulp-sourcemaps保留中间文件: 当我使用gulp-sourcemaps插件时，我通常会删除注释和内容，以便使用sourcemap标题。这使得浏览器debugging器中的原始文件在开发和登台中显示起来更容易，然后在生产中将其删除。我们也尽可能地加载源代码，主要是供应商库。这大部分工作正常。但是，中间文件似乎丢失了。我猜loadMaps选项sourcemaps.init() ，它允许加载现有的地图，删除中间文件，当它获得他们的地图。对于大多数情况来说，这可能是正确的，因为原始文件在那里，但是库往往只包含输出文件，其中映射添加为注释，但不包括那些原始文件。这意味着我们无法访问原始文件，浏览器无法访问构build的库文件。例如， angular-ui-router使用TypeScript编写，然后在生成时输出到JavaScript。这意味着最终开发人员不必在他/她的构build过程中使用TypeScript进行编译，因为这已经在ui-router构build过程中完成了。现在，可以通过<server root>/node_modules/@uirouter/angularjs/release/angular-ui-router.js访问输出的JavaScript文件，原始的TypeScript文件是根据构build文件的源代码注释在<server root>/node_modules/@uirouter/angularjs/node_modules/@uirouter/core/src和<server root>node_modules/@uirouter/angularjs/src文件夹。当我使用我最喜欢的工具将angular-ui-router文件包含到vendor.js或vendor.min.js文件中时，它会将angular-ui-router映射捆绑到生成的.map文件中，但不包括<server root>/node_modules/@uirouter/angularjs/release/angular-ui-router.js文件作为源文件。这意味着我们不能看到这个文件，或者TypeScript文件，这使得只使用浏览器几乎不可能进行debugging。更糟的是，我们得到的任何错误都是源代码映射到TypeScript文件的。我们没有TypeScript文件，所以我们不能看那里，现在我们不知道错误在JavaScript中的哪个地方！谢天谢地， angular-ui-router并没有太多复杂的错误，而且它的确有很好的logging，但是其他的库并没有那么有用。 Is there a way to include intermediate files as sources in the output sourcemap? 否则，是否有一种简单的方法来加载一些像loadMaps东西，而不是其他人？

Task Runner Explorer窗口在我的Gulpfile.js下“加载失败”，并且没有任何构build进程被列出: 这是随机更新我的CSS文件，然后刷新通知没有显示更改。我最终注意到，Task Runner Explorer窗口在我的Gulpfile.js下没有加载，没有列出构build过程。然后，我做了一些研究，重新排列外部工具的列表，正如一些SO线程提到的那样，没有任何东西。然后我注意到gulpfile.js需要一些文件： var gulp = require("gulp"), gulpless = require("gulp-less"), sourcemaps = require("gulp-sourcemaps"), rimraf = require("rimraf"); 这些都不在node_modules文件夹中，所以我完成了npm install gulp-less和npm install gulp-sourcemaps，现在在Output> Task Runner Explorer中进行了检查，并且出现以下错误。无法运行“C：\ projects \ Fusion \ FusionMVC \ Gulpfile.js”… cmd.exe / c gulp – 任务 – 简单 C：\项目\融合\ node_modules \吞-sourcemaps \ node_modules \ strip-.bom \ index.js：2 在Module.load（module.js：439：25）上的Module.exports = x […]

Sourcemap“sources”数组链接到“../../stdin”而不是实际的SCSS文件: 我今天跑npm update ，接下来是一场灾难。我在安装软件包的时候遇到了麻烦，但是在所有的东西看起来都在正确的位置之后，我开始了我的gulp任务，把我的SCSS代码编译成CSS。这段代码重现了我的问题： var gulp = require('gulp'), sourcemaps = require('gulp-sourcemaps'), sass = require('gulp-sass'); gulp.task('sass', function() { gulp.src('www/sass/*.scss') .pipe(sourcemaps.init()) .pipe(sass()) .pipe(sourcemaps.write('.')) .pipe(gulp.dest('www/css')); }); gulp.task('default', ['sass'], function(){ gulp.watch('www/sass/*.scss', {debounceDelay: 2000}, ['sass']); }); 在通过gulp default运行这段代码之后，结果如下： WWW / SASS / example.scss #test { color: red; } WWW / CSS / example.css #test { color: red; } /*# […]