Stack Overflow
Stack Overflow

Questions tagged [source-maps]

A source map allows a JavaScript debugger to map line and symbol information from a transformed (eg. minified, optimized) JavaScript file back to the original input file used for the transformation. The original file can be any kind of text file which in effect enables in-browser debugging of any language compiling to JavaScript.

JavaScript code used on websites has often gone through various stages of automated transformation (eg. minification, optimization, etc.), or have even been generated from a non-JavaScript source language targeting JavaScript as the runtime environment. These automated translations often make the final code much more difficult to understand and debug using development tools inside the browser.

Source maps solve the problem by giving the JavaScript debugger enough additional information to effectively translate locations and symbols between the processed JavaScript code and the original input file used to create it.

JavaScript source maps is a technology proposal from Google and Mozilla, and currently developed inside the Closure Compiler, WebKit, and Mozilla's DevTools.

Because source maps are not yet officially released and documented, good information about them is somewhat scarce. The following articles give an overview of the current state of source maps:

1111 questions
0
votes
0 answers

vuejs2.0 webpack boilerplate: create sourcemap for css

I try to create a sourceMap for my minified css. I use the vuew-webpack-boilerplate In build/utilys.js i added this to my loaders. return { css: generateLoaders(), postcss: generateLoaders(), less: generateLoaders('less'), sass:…
Gregor Voinov
  • 2,203
  • 7
  • 34
  • 52
0
votes
1 answer

Webpack: How to merge css and less, THEN apply cssnano

I managed to compile my css and less resources („imported“ from javascript) to all-my-LESS|CSS, extract them using ExtractTextPlugin and merge them together with MergeFilesPlugin to combinedStyles.css. The bit I am missing: How to run cssnano (e.g.…
Frank N
  • 9,625
  • 4
  • 80
  • 110
0
votes
0 answers

Debugging React app works locally but not on Heroku

I have a small React app deployed on Heroku as described here. When I run the app locally with npm start I can use Google Chrome's debugger pane to view the source of App.js, set breakpoints and use the debugger to step through the source code of my…
davidgyoung
  • 63,876
  • 14
  • 121
  • 204
0
votes
0 answers

Cannot inspect variables when debugging source mapped JS files in Visual Studio

I am unable to inspect the contents of variables in Visual Studio while I am debugging a source-mapped JS file. I can hit breakpoints in the original JS file without any issues but I am unable to see what is inside each of the variables like I used…
Ian
  • 161
  • 1
  • 17
0
votes
1 answer

Error reporting saas for transpiled nodejs app

I'm looking for a SaaS like https://airbrake.io/ or https://sentry.io/ that supports transpiled code. We are using Typescript in one app and Babel in another one. The problem we have is that the errors we get from this tools is the compiled…
bilby91
  • 904
  • 1
  • 8
  • 20
0
votes
1 answer

Breakpoint ignored because generated code not found VSCode Chrome debugging

Using VSCode 1.15, and VSCode Chrome Debugger 3.1.7, my breakpoints are greyed out with with the error in the title "Breakpoint ignored because generated code not found". The .scripts command shows that the paths to the source maps are indeed…
sagooz
  • 31
  • 1
  • 8
0
votes
1 answer

Sentry events are not connected with sourcemaps

New Events are uploaded and soucemap is connected. but still i see this issue. All this events are displayed at release 1.0 . But still i see source maps are not connected .
SUNIL GOWROJI
  • 143
  • 1
  • 2
  • 12
0
votes
1 answer

Gulp-sourcemaps returning only returning `source` js file

My sourcemaps are only returning the source value no matter what. Broswerify.js // add custom browserify options here var customOpts = { entries: ['./frontend/js/app.js'], debug: true }; var opts = assign({}, watchify.args, customOpts); var…
Jamie Hutber
  • 26,790
  • 46
  • 179
  • 291
0
votes
1 answer

Css sourceMappingURL doesnt work correct in Chrome 59.0.3071.115

I have a project that is packaged via webpack. Css is generated from sass with sourceMap. devtool: 'source-map', ... loader: ExtractTextPlugin.extract( 'css-loader?sourceMap=true&minimize=true!' + 'postcss-loader?sourceMap=true!'…
mixalbl4
  • 3,507
  • 1
  • 30
  • 44
0
votes
1 answer

Sourcemap from multiple bundles

I have a main app foo with webpack2 which bundles some node_modules. One of the module is a bar which is also bundled with webpack2 with sourcemaps. I used to have bar bundle injected into foo index.html as a separate script and sourcemaps were…
DeBoer
  • 551
  • 1
  • 7
  • 16
0
votes
2 answers

Running react app on nginx - error in chrome

I am transitioning a react app from webpack-dev-server to nginx. I am building the source bundle with webpack and outputting it to the wwwroot folder for nginx. This works. When I access the root of the app localhost:8080/ with chrome, it stops…
martin
  • 3,289
  • 5
  • 22
  • 27
0
votes
0 answers

webpack view generated sourcemap

I am writing a simple program using webpack. I want to view the sourcemap (.map) file generated by webpack. This is my webpack configuration var path = require('path'); var webpack = require('webpack'); module.exports = { context:…
tmp dev
  • 8,043
  • 16
  • 53
  • 108
0
votes
1 answer

How to generate source maps for original (pre-Babel) source after UglifyJS (Grunt)

Our code in production needs to be minified/uglified ES 5 but in the source we're using ES 6 (and transforming with Babel). I'm trying to figure the correct workflow to maintaining source maps to the original ES 6 source code after running UglifyJS…
krulik
  • 976
  • 1
  • 10
  • 31
0
votes
1 answer

Cannot produce external source map with webpack2

I have an issue after migrating an Angular project from webpack1 to webpack2. Everything works well except sourcemaps. It embeds a sourcemap inside my JS files as a base64 encoded string. It of course creates insanely big files. I want to have…
CGebski
  • 1
  • 1
0
votes
1 answer

VSCode react-native typescript: breakpoints ignored because source code not found

I am unable to have my breakpoints hit in my typescript files inside my react-native project. I have looked at various similar questions here at stackoverflow and also on github. (here, here) Here is my tsconfig.json: { "compilerOptions": { …
TheSoul
  • 4,906
  • 13
  • 44
  • 74
1 2 3
…
73 74