sourcemap messed up

[rkhat]

So basically the only way for a correct mapping is to have one include with no other code in js file. Adding anything gives an incorrect map for everything beyond the first include or first lines of code whichever comes first.

Here is an example of the issue. To build npm install and gulp (or gulp watch). And then open index.html in chrome. Check the lines referenced by the console in devtools.

As you can see in the photo, the mapping is wrong.

[nicekiwi]

+1

[jbh]

+1

[outaTiME]

+1

[chrisdivina]

+1

[SnitchRUS66]

+1

[gsouf]

+100

[outaTiME]

any update with this feature? thanks !!!

[JoshuaSoileau]

+1

[skeddles]

+1

[zlovatt]

Ran into this myself, and noticed that the line #s reported by the mapping was pretty much exactly 2x what it should be in the resulting post-include file.

Verdict: this is caused by the source file line endings being CRLF. As a result, every line # reference is counted twice.

Not sure how to fix this within gulp-include (@wiledal), but workarounds:

• change all of your files to use LF instead of CRLF, and it'll work as expected
• Use something to preprocess your sources, like gulp-line-ending-corrector (https://www.npmjs.com/package/gulp-line-ending-corrector)

Example of the second below.

var gulp = require('gulp'),
    include = require('gulp-include'),
    sourcemaps = require('gulp-sourcemaps'),
    lec = require("gulp-line-ending-corrector");

gulp.task('preprocess', function () {
    return gulp.src('src/*.js')
        .pipe(lec())
        .pipe(gulp.dest('.temp'));
});

gulp.task('js', ['preprocess'], function() {
    return gulp.src('.temp/app.js')
        .pipe(sourcemaps.init())
        .pipe(include())
        .pipe(sourcemaps.write())
        .pipe(gulp.dest('js'));
});

[rejhgadellaa]

+1

[skeddles]

Now I get an error on one of my tasks when I use sourcemapping:

TypeError: resultMap.eachMapping is not a function
    at processInclude (/home/lospec/htdocs/node_modules/gulp-include/index.js:206:39)
    at include (/home/lospec/htdocs/node_modules/gulp-include/index.js:58:26)
    at wrappedMapper (/home/lospec/htdocs/node_modules/map-stream/index.js:83:19)
    at Stream.stream.write (/home/lospec/htdocs/node_modules/map-stream/index.js:95:21)
    at DestroyableTransform.ondata (/home/lospec/htdocs/node_modules/readable-stream/lib/_stream_readable.js:619:20)
    at DestroyableTransform.emit (events.js:188:13)
    at DestroyableTransform.EventEmitter.emit (domain.js:459:23)
    at addChunk (/home/lospec/htdocs/node_modules/readable-stream/lib/_stream_readable.js:291:12)
    at readableAddChunk (/home/lospec/htdocs/node_modules/readable-stream/lib/_stream_readable.js:278:11)
    at DestroyableTransform.Readable.push (/home/lospec/htdocs/node_modules/readable-stream/lib/_stream_readable.js:245:10)
[18:56:53] The following tasks did not complete: js
[18:56:53] Did you forget to signal async completion?

The error goes away and it compiles file if I comment out the sourcemapping parts:

gulp.task("js", function() {
    return gulp.src('scripts/*.js')
        //srcmap
        //.pipe(sourcemaps.init())
        //include other files
        .pipe(include({
            includePaths: [
                'modules/js',
                'modules/frontend',
                'scripts',
            ]
        }))
            .on('error', console.log)
        //compress
        .pipe(liveOnly(uglify({compress: {drop_console: true }})))
            .on('error', function (err) { gutil.log(gutil.colors.red('[Error]'), err.toString()); })
        //srcmap
        //.pipe(sourcemaps.write('./maps'))
        //out
        .pipe(gulp.dest("public/javascripts"));
});

Perhaps it's because var resultMap = new SourceMapConsumer(result.map); seems to return a promise? I don't understand promises well enough to fix it unfortunately.

[callaginn]

@skeddles Did you ever figure out this issue? Been running into this two years later, over and over again. And like you, if I comment out sourcemaps, it goes away:

TypeError: resultMap.eachMapping is not a function
    at processInclude (/Users/stephen/Sites/templates/twig-site/node_modules/gulp-include/index.js:206:39)
    at include (/Users/stephen/Sites/templates/twig-site/node_modules/gulp-include/index.js:58:26)
    at wrappedMapper (/Users/stephen/Sites/templates/twig-site/node_modules/map-stream/index.js:83:19)
    at Stream.stream.write (/Users/stephen/Sites/templates/twig-site/node_modules/map-stream/index.js:95:21)
    at DestroyableTransform.ondata (/Users/stephen/Sites/templates/twig-site/node_modules/readable-stream/lib/_stream_readable.js:619:20)
    at DestroyableTransform.emit (node:events:527:28)
    at DestroyableTransform.emit (node:domain:537:15)
    at addChunk (/Users/stephen/Sites/templates/twig-site/node_modules/readable-stream/lib/_stream_readable.js:291:12)
    at readableAddChunk (/Users/stephen/Sites/templates/twig-site/node_modules/readable-stream/lib/_stream_readable.js:278:11)
    at DestroyableTransform.Readable.push (/Users/stephen/Sites/templates/twig-site/node_modules/readable-stream/lib/_stream_readable.js:245:10)
[09:29:30] Finished 'scss' after 819 ms
[09:29:40] The following tasks did not complete: watch, <series>, <parallel>, js
[09:29:40] Did you forget to signal async completion?
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

And yeah, I've wondered the same thing about promises, since it mentions issues with async completion.

Here's my current init code:

function js() {
    return gulp.src(globs.build.js)
        .pipe(sourcemaps.init())
        .pipe(include(config.js)).on('error', console.log)
        .pipe(rename({suffix: '.min'}))
        .pipe(sourcemaps.write('.'))
        .pipe(gulp.dest(dist.js))
        .pipe(tap(file => alert.success(file)))
        .pipe(browsersync.stream());
};

[skeddles]

unfortunately I resorted to just not using sourcemaps for js