I have two create-react-apps in a repo: shared
and my-app
.
There is a shared/src/Test.js
component:
export default function Test(){
return <div>This is the shared component!!!</div>
}
In my-app
I have installed the following:
npm install react-app-rewired customize-cra ../shared
and added
config-overrides.js
var path = require ('path');
var fs = require ('fs');
const {
override,
addDecoratorsLegacy,
babelInclude,
disableEsLint,
} = require("customize-cra");
module.exports = function (config, env) {
return Object.assign(config, override(
disableEsLint(),
addDecoratorsLegacy(),
babelInclude([
path.resolve('src'),
fs.realpathSync("node_modules/shared/src")
])
)(config, env)
)
}
In my-app/src/App.js
I import Test from "shared/src/Test"
and add <Test />
to the output.
Which when run throws this error:
SyntaxError: shared/src/Test.js: Support for the experimental syntax 'jsx' isn't currently enabled (4:12):
Am I missing a step? Is there a simpler way then using react-app-rewired to set up this shared library.