Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

sourceRoot doesn't work for files in sub folders #191

Open
SetTrend opened this issue Apr 13, 2016 · 16 comments
Open

sourceRoot doesn't work for files in sub folders #191

SetTrend opened this issue Apr 13, 2016 · 16 comments

Comments

@SetTrend
Copy link

I have stored my source files in a number of sub folders.

It looks like the sourceRoot parameter doesn't correctly handle those files. It doesn't consider the relative part beginning at the sources' root up to their actual location when creating the source map entry.

sourcemaps


Please refer to this issue for reference:

microsoft/vscode#4705

@bryceg
Copy link

bryceg commented Apr 22, 2016

+1 I've been struggling with this also

@marcinant
Copy link

👍

@lexon0011
Copy link

Any solution??

@ckiely91
Copy link

This solution worked for me on Ubuntu but may not work on Windows, haven't tested that.

.pipe(sourcemaps.write('.', {
        includeContent: false,
        sourceRoot: function(file) {
            return '../'.repeat(file.relative.split('/').length) + 'src';
        }
    }))

@lexon0011
Copy link

Thanks @ckiely91 - I only change file.relative.split('/') to file.relative.split('\\') so that it also works under windows.

@SetTrend
Copy link
Author

Yes, but I prefer to keep in mind that this is only a workaround. No-one out there is aware of that quirk. It should get fixed soon.

@zhakhalov
Copy link

Hi
I've got same issue
Thanks @ckiely91. Your solution was very helpful.
Here is my full task for "Node.js targeted" TS. Hope it would be useful...

gulp.task('build', () => {
  const project = ts.createProject('tsconfig.json');
  return gulp.src('./app/**/*.ts')
    .pipe(sourcemaps.init())
    .pipe(ts(project))
    .js
    .pipe(sourcemaps.write('./', {
      includeContent: false,
      sourceRoot: file => `${'../'.repeat(file.relative.split(/^win/.test(process.platform) ? '\\' : '/').length)}app`
    }))
    .pipe(gulp.dest('./dist'));
});

I found following code in sources of plugin

    if (typeof options.sourceRoot === 'function') {
      sourceMap.sourceRoot = options.sourceRoot(file);
    } else {
      sourceMap.sourceRoot = options.sourceRoot;
    }

Looks like sourceMap passed to output as is without, resolution of extra ../

@ckiely91
Copy link

@zhakhalov, found that you can actually just use path.sep instead of /^win/.test(process.platform) ? '\\' : '/' to make it platform independent.

@jacamera
Copy link

jacamera commented Oct 4, 2016

I agree that the sourceRoot option does not work as expected when assigning a string value and source files are located in sub directories.

Here's a workaround using the path util:

const path = require('path');
// ...
sourceRoot: (file) => {
    return path.join(path.relative(path.join(outputDir, path.dirname(file.relative)), '.'), sourceDir);
}

@gms1
Copy link

gms1 commented Nov 20, 2016

workaround ( version 2.2.0 ) didn't work for me.
I guess
var destSourceMapPath = path.join(file.cwd, options.destPath, mapFile);
should be changed to:
var destSourceMapPath = path.join(file.cwd, mapFile);
because mapFile already contains the destPath:
var mapFile = path.join(destPath, file.relative) + '.map';

@jfstephe
Copy link

jfstephe commented Feb 8, 2017

For whatever reason updating the sourceRoot as above didn't work for me so I updated the mapSources directly. Thanks to everyone for leading me to this!

mapSources: function(sourcePath, file) {
let relativeLocation = path.join(path.relative(path.join(outputDir, path.dirname(file.relative)), '.'), 'src/');
let relativeLocationToFile = path.join(relativeLocation, sourcePath);
return relativeLocationToFile;
}}))

@helloli
Copy link

helloli commented Mar 3, 2017

The same problem when working with gulp-less. The less files in sub folders cannot pointing to less but css file.

@a8775
Copy link

a8775 commented Mar 31, 2017

+1

@demurgos
Copy link

demurgos commented Nov 17, 2017

Well, I had lots of trouble, trying to find the right combination to make it work. In the end I found a simple expression that worked for any combination of subdirectories, depth or relative location between the source and build directories:

const writeSourceMapsOptions = {
  sourceRoot: (file) => {
    return path.posix.relative(path.posix.dirname(file.relative), "");
  },
};

and then just pass it to .pipe(gulpSourceMaps.write(writeSourceMapsOptions)).

This works for both Istambul reports and the Node debugger.

@nmccready
Copy link
Collaborator

@demurgos I wonder if you solution should become the default. Except, that it should work regardless of OS type. Feel free to add a PR with some specs.

@demurgos
Copy link

demurgos commented May 2, 2018

Relative posix paths are compatible with both Linux and Windows so I use them (tested on both platforms). It works fine if everything happens inside the project's directory. I don't have enough experience with Windows to know how it would handle source and dest directories on different drives.

I'll find some time next week to submit a PR with spec so source roots work out of the box.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests