Create-react-app: Make the SSL certificate and key configurable for localhost

Created on 21 Feb 2018  路  6Comments  路  Source: facebook/create-react-app

I want to be able to provide self-signed certs and keys to my app during localhost development. These files need to be passed to the webpack-dev-server that runs behind the scenes when I do the "npm start" script from this package.

There are many ways to sign your own SSL certificate, and I know webpack-dev-server has the ability to run https over its own self-signed certificate.

However, this doesn't meet my request. I also know that the webpack-dev-server can take in key and cert file locations as arguments, and that is what my issue is targeting. I think we should add the ability to configure certificate and key file locations. This will make any development requiring SSL on localhost more straightforward.

How could we go about doing that?

I think there are two options:

  • Make them optional command-line arguments for the "npm start" script, configurable in package.json
  • Make the keys and certs follow a common naming convention or possibly use a certain folder structure
proposal

Most helpful comment

For anyone landing here looking for custom HTTPS certificates setup, react-app-rewired solved it: https://github.com/timarney/react-app-rewired#extended-configuration-options

All 6 comments

For anyone landing here looking for custom HTTPS certificates setup, react-app-rewired solved it: https://github.com/timarney/react-app-rewired#extended-configuration-options

This would be really nice. I want to be able to add my development certificate as a trusted certificate to keychain so I don't get browser security warnings. I can do that now, but there are various situations that the webpack generated certificate will get deleted so I have to remove the old certificate from keychain and trust a new certificate.

This has been in the pipeline this long?

I don't get it. You provide a simple endpoint for proxy configuration, why not an endpoint of configuration of the larger webpack server?

I'll be back shortly with a PR.

@rlueder were you able to get it to work in CRA2? React-app-rewired only supports CRA1, and there's no plugin available in https://github.com/arackaf/customize-cra

@goldylucks there's actually an easier way described here: https://github.com/facebook/create-react-app/issues/6126#issuecomment-475257395

@rlueder thanks man, that worked like a charm!

Was this page helpful?
0 / 5 - 0 ratings