Cannot get the distributed package to work with Rollup
MaxMotovilov opened this issue · comments
There is some odd conflict between the logic in @rollup/plugin-commonjs and the interop conventions adopted by the build script in hookrouter. Given Rollup configuration which is roughly this (including only the relevant parts):
import nodeResolve from '@rollup/plugin-node-resolve';
import extGlobals from 'rollup-plugin-external-globals';
import cjs from '@rollup/plugin-commonjs';
export default {
input: { ... },
output: {
format: 'es',
interop: 'auto',
...
},
external: ['react', 'react-dom', ...],
plugins: [
nodeResolve(...),
cjs({
include: 'node_modules/**'
}),
extGlobals({
'react': 'React',
'react-dom': 'ReactDOM',
...
})
],
...
}
I am getting the following inexplicable error during the build:
[!] Error: Export 'React' is not defined (Note that you need plugins to import files that are not JavaScript)
react?commonjs-external (1:8)
1: export {default} from "react";
^
Error: Export 'React' is not defined (Note that you need plugins to import files that are not JavaScript)
I have verified that it is caused by a proxy chunk generated by @rollup/plugin-commonjs when processing modules in hookrouter. Experimenting with plugin settings, I discovered that setting esmExternals: true
makes the error disappear only to result in improper access to the React exports (via global) during runtime. Clearly my combination (Rollup and externally loaded React script) conflicts with the code generated during hookrouter build.
Now, just as I suspected, the problem has a very simple solution -- feeding the hookrouter source code into Rollup. I had to use a git submodule and a bit of npm fakery to achieve that (package.json
for hookrouter does not set module
field, only main
-- and that of course points to dist/
rather than src/
). I would generally prefer to deal with source ES6++ library code when bundling with Rollup anyway, but thus far this is the first library that resolutely refused to build from distributed package.
My suggestion for the time being is to, perhaps, include the src/
directory in the package and set the module
field in package.json
to point to it.