Problem
I'm currently facing an interesting issue
when bundling my npm package (Typescript) for esm
with the target ES2015
.
For bundling, I use rollup
and esbuild
. See GitHub; (Line 71-101
)
tsconfig.json
{
"extends": "../tsconfig.default.json",
"compilerOptions": {
"target": "esnext",
"outDir": "dist",
"rootDir": "src"
},
"include": [
"./src/**/*" // Only include what is in src (-> dist, tests, .. will be excluded)
]
}
For whatever reason, almost every bundled esm
file has a check to see if require
is undefined
in the file header (see image), even though require
isn't used anywhere in the unbundled source code and, in fact, esm
doesn't work with require
, right?
// Added require check
typeof require !== "undefined" ? require : (x) => {
throw new Error('Dynamic require of "' + x + '" is not supported');
};
I wouldn't mind this check if not every React application that imports the npm package
receives 100 warnings telling them that require is used incorrectly
. (see image)
// Warning Message
Critical dependency: require function is used in a way in which dependencies cannot be statically extracted
Question
Does anybody know why this described require
check is added to the file header
and how I can get rid of it.
Note: I've already seen this post, but it's related to Angular, so I don't think it helps me much: Critical dependency: require function is used in a way in which dependencies cannot be statically extracted