Right now there're 3 separate React apps created with create-react-app
. I need to put them into one folder. It works fine when I do npm run build
. The question is how can I configure webpack to be able to run local dev server for a specific app with a command like npm run dev:second-app
To configure webpack without ejecting I use react-app-rewired
package. Here's the code:
config-overrides.js
const path = require('path');
module.exports = function override(config, env) {
config.entry = {
firstApp: "./src/firstApp/index.js",
secondApp: "./src/secondApp/index.js",
thirdApp: "./src/thirdApp/index.js"
}
config.optimization.runtimeChunk = false;
config.optimization.splitChunks.name = 'shared';
config.output = {
path: path.resolve(__dirname, 'shopify'),
publicPath: '/',
filename: 'assets/[name].main.js',
chunkFilename: 'assets/[name].chunk.js'
}
return config;
};
package.json
...
"scripts": {
"start": "react-app-rewired start",
"build": "react-app-rewired build",
"postinstall": "patch-package"
}
...