Generated report has area named 'null'

[peterswallow]

Description When I run the tool on my .js file it produces an area named "null" with a percentage of 24% 124Kb.

Steps to reproduce

1. Run source-map-explorer bundle.js
2. See large area of report with name 'null'

Files to reproduce Can't provide files as they are sensitive.

Additional information I'm not sure this is a bug. Perhaps it's caused by my code being minified and its screwing with the maps, although the rest of the report looks correct with expected class names.

[peterswallow]

Similar issue... https://stackoverflow.com/questions/58606457/what-does-the-null-area-correspond-to-in-the-source-map-explorer-visualisation

Any tips on analysing which packages are causing the null?

[nikolay-borzov]

Apparently null is generated code (e.g. webpack) - code that doesn't have a source file. 138-318 ,function(e,a,n){e.exports=n(11)},,,,,function(e,a,n){},function(e,a,n){},function(e,a,n){"use strict";n.r(a);var t=n(0),o=n.n(t),r=n(2),c=n.n(r),l=(n(9),n(3)),s=n.n(l);n(10) 1073-1086 ,[[4,1,2]]]); Perhaps we should name it approprietly to avoid confusion

[borisdiakur]

Apparently null is generated code (e.g. webpack) - code that doesn't have a source file. 138-318 ,function(e,a,n){e.exports=n(11)},,,,,function(e,a,n){},function(e,a,n){},function(e,a,n){"use strict";n.r(a);var t=n(0),o=n.n(t),r=n(2),c=n.n(r),l=(n(9),n(3)),s=n.n(l);n(10) 1073-1086 ,[[4,1,2]]]); Perhaps we should name it approprietly to avoid confusion

@nikolay-borzov Can you help me understand what that means exactly? So I have code in my bundle that is generated by webpack and does not have a source? What does it do there? What is its purpose? It’s currently over 60% of that code in my bundle 😱

[nikolay-borzov]

@borisdiakur have you tried loading the source map into https://sokra.github.io/source-map-visualization? You can checkout source-map-explorer repo and debug your source map

mergedRanges.forEach(({ start, end, source }) => {
      // To account unicode measure byte length rather than symbols count
      const rangeByteLength = Buffer.byteLength(line.substring(start, end + 1));

     if(source === NO_SOURCE_KEY) {
       // This will output code that has no source 
       console.log(line.substring(start, end + 1))
     }

      ...
    });