timarney / react-app-rewired

Override create-react-app webpack configs without ejecting
MIT License
9.8k stars 424 forks source link

How to return multiple webpack configurations properly? #629

Closed Arkellys closed 2 years ago

Arkellys commented 2 years ago

Hello, I need to build for different targets and according to webpack's documentation, I have to use multiple configurations in order to do that. So instead of returning a single configuration, I return an array containing both configurations:

module.exports = {
   webpack: (config) => {
      // [...] Original config override

      const electronConfig = {
         target: "electron-main",
         mode: "production",
         entry: path.join(__dirname, "src", "electron.js"),
         output: {
            path: path.resolve(__dirname, "build"),
        filename: "static/js/electron.js"
         },
         module: {
            rules: [
               {
                  test: /\.?js$/,
                  exclude: /node_modules/,
                  use: {
                     loader: "babel-loader",
                     options: {
                        presets: ["@babel/preset-env", "@babel/preset-react"]
                     }
                  }
               }
            ]
         },
         plugins: [
            new HtmlWebpackPlugin({
               chunks: ["electron"],
               inject: false
            })
         ]
      };

      return [config, electronConfig];
   }
};

Now, if I try to build the app I get an error:

  309.08 kB  build\static\js\main.16c4ca1d.js
  14.01 kB   build\static\css\main.e82c063c.css
  3.89 kB    build\static\js\electron.js
  2.82 kB    build\static\js\389.1f4c0928.chunk.js
  2.35 kB    build\static\js\422.f2cecec0.chunk.js
  1.82 kB    build\static\js\183.a71eb1d3.chunk.js

Cannot read properties of undefined (reading 'publicPath')
error Command failed with exit code 1.

Despite this error, the files seem to be correctly compiled.

I have no idea what this error means since publicPath is an option set in output, and it is defined is both configurations. I don't have this error if I return a single configuration (both work).

I am missing something or is react-app-rewired not compatible with multiple configurations? How can I do?

Arkellys commented 2 years ago

I found out where the problem comes from. It's because of this line on CRA's build script. With multiple configurations, config.output is undefined since config is an array. I don't think react-app-rewired can solve this problem so I will close this issue.