erikbrinkman/d3-dag

ESLint Warnings from Minified JS File

AmroNagdy opened this issue · 5 comments

Importing this library on v0.9.0 as a React application (using Craco) I get the following compilation warnings when running craco start:

./node_modules/d3-dag/bundle/d3-dag.esm.min.js
Critical dependency: require function is used in a way in which dependencies cannot be statically extracted

./node_modules/d3-dag/bundle/d3-dag.esm.min.js
Critical dependency: require function is used in a way in which dependencies cannot be statically extracted

I am happy to make the change myself, but would like some pointers in the codebase as to where this might be cropping up.

If you're importing it as esm, you should be able to import the non-minified version from d3-dag/dist, so that plus more verbose logging to get a line / character number would help.

I'm not familiar with craco so I'd have to look into it and try running it on the library itself.

craco is a configuration wrapper around create-react-app based React projects. In this case I do not believe it is entirely relevant, as I suspect the compilation warning is reproducible by running react-scripts start or react-scripts build, on a default create-react-app setup that has d3-dag as a dependency, as well.

Interestingly, if I use import * as d3Dag from "d3-dag/dist" as the import (rather than d3-dag), then craco start (or craco build) compile successfully and show no warnings. As a result I suspect this is due to the minification process. I have also noticed the same warning on older versions such as v0.8.2.

That's interesting that it's only from the minified version. That should make it easy to debug, even from your end as the full build script is in the package.json file. It's just

esbuild dist/index.js --bundle --minify --format=esm --define:this=undefined --external:fs --external:child_process --banner:js=\"$(preamble)\" --outfile=bundle/d3-dag.esm.min.js

and is built solely from the dist files, so you should be able to run it locally to create your own minified version. The banner should be unnecessary, and I'm curious if it's part of the bundling or part of the minification, e.g. what happens if you remove --minify?

I still haven't sat down to actually try and reproduce this, but do you think it would be possible to get more verbose warnings with line / character numbers?

After some investigation, this is due to a problem with bundling that I haven't been able to fix. One of the libraries I depend on is a node library that uses fs and child_process. I don't need this functionality, so I want to just strip it out, but I haven't found a good way with esbuild. Currently I'm marking them as external, but this had esbuild insert some checks to see if it can actually import fs and child_process . These wrappers use the literal require, which then breaks the linting.

I'm currently searching for a way to actually just remove these modules from the bundle, which should fix this issue.

just pushed a patch diff 0.9.1 that should have appropriately removed those dependencies, and should no longer cause the issue when using the minified version. On my local test the errors went away, but feel free to reopen if you still see them on 0.9.1.