gradejs icon indicating copy to clipboard operation
gradejs copied to clipboard

Packages are not being detected when concatenateModules is set to true

Open kubk opened this issue 3 years ago • 6 comments

Hi, I am a Mobx team member and I'd like to see if GradeJS detects Mobx. This library is listed among the indexed packages.

I've created a brand new create-react-app project and added Mobx there.

  • Demo url: https://main.d2hs7t5ht45j2t.amplifyapp.com/
  • Reproduction repo: https://github.com/kubk/gradejs-test
  • GradeJS analyze result: https://gradejs.com/w/main.d2hs7t5ht45j2t.amplifyapp.com

As you can see it doesn't detect mobx and mobx-react, but it does detect react, react-dom

To get the build locally clone the repo and run npm run build in the project folder.

I've chosen create-react-app because it uses Webpack internally and it has 3.1+ millions installations per week. So chances that the webpack configuration is screwed up are pretty low. If you want to see the configuration you can run npm run eject script in the project folder.

Since GradeJS currently supports only Webpack 3-5, I checked that the current Webpack version matches this requirement by running npm ls webpack. It shows version 5.72 everywhere:

Screen Shot 2022-04-18 at 16 11 55

The Mobx itself is built using Rollup. Also it is a monorepo in case it matters.

Let me know if you need more details.

kubk avatar Apr 18 '22 13:04 kubk

Hi Egor, thanks for the contribution. We are currently busy with some pre-release improvements and will run synthetic tests on different webpack presets with mobx and mobx-react earlier next week and get back to you with more information.

spalt08 avatar Apr 20 '22 05:04 spalt08

Hi Egor, I'm sorry for the delay, we have been working on some product features instead of accuracy recently. We haven't forgot about the issue and will investigate it in the near future

spalt08 avatar May 30 '22 14:05 spalt08

@spalt08 Sure, take your time. Thanks for keeping me posted 👍

kubk avatar May 30 '22 16:05 kubk

Hi Egor, Sorry for the delay. I took a look at the bundle and found that mobx esm module code was inlined into application code along with some other libraries inside the IIFE generated by webpack, see the illustration:

image

I tried to set optimization.concatenateModules to false in the webpack config explicitly, and it helped:

image

Unfortunately, we don't support matching inlined modules at the moment, but we have this case in our research roadmap, as it is default behavior of any application built with create-react-app.

ctizen avatar Jul 06 '22 14:07 ctizen

@ctizen Thanks for digging into this 👍 CRA is quite popular, it'd be nice to have a solution for the concatenateModules option. Should I rename the issue title to something like "Packages are not being detected when concatenateModules is set to true"?

kubk avatar Jul 07 '22 16:07 kubk

@kubk No problem, renamed it. Thanks:) We'll reach out when we have the solution.

ctizen avatar Jul 13 '22 11:07 ctizen