I have a rails project that I'm migrating from webpacker to vite.js and a number of my private packages, bundled with webpack all are built with react and so the rails project was setup with webpack and installed react/-dom itself for use in these installed packages.
In the webpacker config I had to setup aliases for most of these so they could find React and React Dom.
const { resolve } = require('path');
module.exports = {
React: resolve(__dirname, '../../node_modules/react'),
ReactDOM: resolve(__dirname, '../../node_modules/react-dom'),
"react": resolve(__dirname, '../../node_modules/react'),
"react-dom": resolve(__dirname, '../../node_modules/react-dom'),
AsyncStorage: resolve(__dirname, '../../node_modules/@react-native-community/async-storage'),
Pusher: resolve(__dirname, '../../node_modules/pusher-js')
}
But I can't find in the vite.js or rollup.js documentation where or even if I have to do something similar. This section of vite's docs makes me think that it's supposed to just be handling it magically but appears to not be.
Here's an example of the error I'm getting:
✘ [ERROR] Could not resolve "ReactDOM"
node_modules/skarsnik/bundled/plugin.js:1:107:
1 │ ...of exports&&"object"==typeof module?module.exports=e(require("React"),require("ReactDOM"),require("GobblaPackage")):"function"==typeof define&&define.amd?define(["Re...
╵ ~~~~~~~~~~
You can mark the path "ReactDOM" as external to exclude it from the bundle, which will remove this
error. You can also surround this "require" call with a try/catch block to handle this failure at
run-time instead of bundle-time.
Any ideas would be greatly appreciated
EDIT
also looking at one of the webpack bundled packages I have externals config which may explain the "Could not resolve 'ReactDOM'":
externals: {
'react': "React",
'react-dom': 'ReactDOM',
'@realgeeks/gobbla/bundled/plugin': "GobblaPackage",
"@react-native-community/async-storage": "AsyncStorage"
}