Source Maps with steal build

#1

Trying to use source maps in Chrome generated by steal build. After build, folder structure and less files are recognized by browser but not the corresponding component JS files nor Model folders / files in source folder tree.

Also do not see a special request for .js.map file in Network panel

#2

We have the same problem.

We track javascript errors with TrackJS and they use the sourcemaps to highlight the error. But TrackJS can’t match the error.

The error happens on line 2 and column xxx in main.js. But main.js only has 1 line.

Any ideas?

Running out of time now, but I will try to investigate some more.

#3

Source maps are turned off by default. You can generate them in your build script like:

stealTools.build({}, {
  sourceMaps: true,
  sourceMapsContent: true
});

Note that sourceMapsContent is not needed, it’s only helpful if the original source files are not available from the server (which is often the case if you package the dist/ folder).

The docs are here.

#4

Hi, @matthewp. I know how to generate sourcemaps, we use it. But something seems wrong.
I’ve investigated a little more and this is what I found:

This is my main.js throwing an error at line 3 (foo is undefined):

'use strict';

const a = window.foo.length;

for(let i = 0; i < 10; i++) {
	console.log(i);
}

If I build it with minify: false and sourceMaps: false the error in the console leads me to the right position.
01 minify-false-sourcemaps-false

If I build with sourceMaps: true
The error message says it fails at line 5.

error-message
error-message.png803×161 26 KB

But at line 5 (sourcemapped main.js) is the for loop and not the error.
02 minify-false-sourcemaps-true

Hope that clarifies the issue.

#5

Anyone an idea?
Sourcemaps are useless, the error always points to the last line of the main.js file…

#6

please file an issue on github. i will create a sample app and a breaking test if something goes wrong.

#7

Done: #832