cssreactjscreate-react-apptailwind-csscraco

How to start react app on custom port with CRACO?

I want to use Tailwind CSS for my react apps. The problem is CRACO start starts the app on the default port, which is 3000 and I want to have custom ports but I can't figure out what is the right approach. ( Can't find anything about this in their documentation )

I tried something like PORT=5000 CRACO start inside the scripts field of the package.json file but doesn't work. Any idea?

Solution

  • CRACO use the webpack devserver configuration to set the port.

    you need to create a configuration. read more here in the readme:

    https://github.com/gsoft-inc/craco/blob/master/packages/craco/README.md#configuration-file

    So you solution need to redefine devServer. How to define it read in the webpack documentation:

    https://webpack.js.org/configuration/dev-server/#devserver