I have a react component which I needed to load as a node module in another webpack2 project. Using babelify I converted the react component code to normal javascript code. Following is config I provided to convert.
browserify: {
dist: {
options: {
transform: [['babelify', {presets: ['es2015', 'react']}]],
external: ['react', 'react-dom']
},
src: ['src/index.js'],
dest: 'dist/comp-babelified.js',
}
}
it successfully converted the code. And I am able to load it into the webpack application. But when the webpack application loaded in browser, getting following error in the browser console.
Uncaught (in promise) Error: Cannot find module 'react'
If I remove external
from browserify options, I am getting following error.
Uncaught (in promise) Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined.
Looks like it basically unable to load the react component.
How to correct this issue?
Update: I have gone through Uncaught ReferenceError: React is not defined . I don't have React globally. I am expecting webpack understands require('react')
which is already available in the node_modules.