CODEWITHSUNDEEP
cssreactjscreate-react-apptailwind-csscraco
DIIMIIM
DIIMIIM

Reputation: 599

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?

Upvotes: 9

Views: 13854

Answers (2)

Kildareflare
Kildareflare

Reputation: 4768

The accepted answer contains links to the relevant information, but in case they become invalid or you are too lazy to look at them here is the config you need to add to your craco.config.js file.

module.exports = {
  devServer: {
    port: 5000
  }
}

Note that devServer is a top level property in the config.

Upvotes: 22

Sysix
Sysix

Reputation: 1796

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

Upvotes: 4

Related Questions