3

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"
  }
...
Anton Gusar
  • 513
  • 1
  • 3
  • 14

0 Answers0