FormidableLabs / inspectpack

An inspection tool for Webpack frontend JavaScript bundles.
MIT License
592 stars 20 forks source link

BUG: Webpack stats object failing type validation (`Cannot load module/asset sizes.`) #110

Closed westbrook-asapp closed 5 years ago

westbrook-asapp commented 5 years ago

I'm making the jump from v0.4.0 to ^3.0.0 and when I run my application I get the following display where the application is built, but the module/asset sizes (and problems when available) are blocked from display due to errors. I checked into some similar issues (e.g. #182) in other posts, but most of them discuss development in dependencies like inspectpack, etc. that have since completed, so I'm at a loss.

While webpack is kind of new to me, I'm pretty comfortable saying that the below config is a bit expansive so please let me know what additional or focused information I could supply to help track this issue down. Thanks!

====================================================================

If the issue is visual, please provide screenshots here

image

====================================================================

Steps to reproduce the problem

====================================================================

Please provide a gist of relevant files

Entry script:

ENABLE_SOURCE_MAPS=true NODE_ENV=development webpack-dashboard -- webpack-dev-server --config webpack.config.local-dev.js --host 0.0.0.0 --no-inline

webpack.config.js

REDACTING PER MANAGEMENT :/ Let me know if there is less complete information I can share in support of finding a solution here!

====================================================================

More Details
ryan-roemer commented 5 years ago

Is there any chance that you could create a minimal reproduction for this error in a public repository with install + running instructions?

Alternatively, if a private project, you could create a full stats object with something like:

const { StatsWriterPlugin } = require("webpack-stats-plugin");

module.exports = {
  // ...
  plugins: [
    new StatsWriterPlugin({
      fields: ["assets", "modules"]
    })
  ]
};

in your webpack config, and go through and manually replace all of the "source": field values containing actual source with say: console.log('REMOVED'); or something... That would similarly give us enough to debug further.

Offhand, it looks like the webpack stats object violates inspectpack's type shape, and I'm really curious as to what the stats object looks like / what's going on.

Thanks!!!

westbrook-asapp commented 5 years ago

I'm going to do what I can. It's a pretty large, private project and my webpack-foo is lacking, but I love creating problems that get people curious and want to help find a solution!

I will say as I address from a couple of different sides, this seems to stem from something the fork-ts-checker-webpack-plugin is doing to the code. Possibly the asyncrony of it all, but that could also be a red herring. Will report back.

westbrook-asapp commented 5 years ago

OK, I think this is what you're looking for 🤞 https://gist.github.com/westbrook-asapp/a39ea69aece0413e99ea57c6a5783c1f Let me know how else I can support tracking down a resolution to this!

ryan-roemer commented 5 years ago

Thanks @westbrook-asapp ! Given the size of that beast, I appreciate the effort it must have taken to get that in workable shape to post here.

I am able to suck that into inspectpack straight up and will hopefully be able to figure out what's going on. I'm not sure of exact timeline, but hopefully by end of this week...

ryan-roemer commented 5 years ago

First issue: Expecting string at modules.4.0.chunks.0.0 but instead got: null.

    {
      "id": 4,
      "identifier": "/PATH/TO/node_modules/prop-types/index.js",
      "name": "./node_modules/prop-types/index.js",
      "index": 478,
      "index2": 475,
      "size": 1078,
      "cacheable": true,
      "built": true,
      "optional": false,
      "prefetched": false,
      "chunks": [
        null,
        null,
        null,
        null,
        2,
        4,
        7,
        8,
        9
      ],
      // ... snipped ...
    },