In CRA 5.0.0, `react-scripts start` fails when both `HOST` in `.env` and `proxy` in `package.json` are defined.
See original GitHub issueDescribe the bug
In CRA 5.0.0, react-scripts start
fails when both HOST
in .env
and proxy
in package.json
are defined.
Did you try recovering your dependencies?
This occurs on a newly created project.
Which terms did you search for in User Guide?
“allowedHosts” and others, came up empty.
Environment
Environment Info:
current version of create-react-app: 5.0.0
running from /home/z003w3we/.npm/_npx/c67e74de0542c87c/node_modules/create-react-app
System:
OS: Linux 5.4 Ubuntu 20.04.3 LTS (Focal Fossa)
CPU: (4) x64 Intel(R) Core(TM) i7-9850H CPU @ 2.60GHz
Binaries:
Node: 16.13.0 - ~/.asdf/installs/nodejs/16.13.0/bin/node
Yarn: 1.22.10 - ~/.asdf/shims/yarn
npm: 8.1.3 - ~/.asdf/plugins/nodejs/shims/npm
Browsers:
Chrome: 96.0.4664.45
Firefox: 95.0
npmPackages:
react: ^17.0.2 => 17.0.2
react-dom: ^17.0.2 => 17.0.2
react-scripts: 5.0.0 => 5.0.0
npmGlobalPackages:
create-react-app: Not Found
Steps to reproduce
- Create a new app.
- Set
HOST
in.env
. - Set
proxy
inpackage.json
. - Run
react-scripts start
or something to that effect.
Expected behavior
App starts.
Actual behavior
I get this error:
> yarn start
yarn run v1.22.10
$ react-scripts start
Attempting to bind to HOST environment variable: test.localhost
If this was unintentional, check that you haven't mistakenly set it in your shell.
Learn more here: https://cra.link/advanced-config
Invalid options object. Dev Server has been initialized using an options object that does not match the API schema.
- options.allowedHosts[0] should be a non-empty string.
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
Reproducible demo
Issue Analytics
- State:
- Created 2 years ago
- Reactions:11
- Comments:16 (1 by maintainers)
Top Results From Across the Web
Invalid options object. Dev Server has been initialized using ...
When trying to emulate what I was using with the proxy value in my package.json file, I receive a client error: domain option...
Read more >What Does Create-React-App Actually Do? | by Andrew Mc
This is where the line “Installing react, react-dom, and react-scripts…” appears. The installation is done asynchronously. If it fails package.json, ...
Read more >react-app-rewired - npm
Start using react-app-rewired in your project by running `npm i react-app-rewired`. There are 315 other projects in the npm registry using ...
Read more >Why you should use a proxy server with Create React App
Because most client apps are hosted on different servers than the backend application, there are complications that arise as a result of ...
Read more >Which changes are necessary for upgrading to React 18 and ...
This is my package.json file after performing upgrade. ... "test": "cross-env CI=true react-scripts test --env=jsdom", ...
Read more >
Top Related Medium Post
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
The answer from josipat in
https://stackoverflow.com/questions/70374005/invalid-options-object-dev-server-has-been-initialized-using-an-options-object/70491173#70491173
works. I will just paste his answer here again, just for easy access.
npm install http-proxy-middleware
npm start
I encountered the problem when I tried:
(and I have a
proxy:
setting inpackage.json
).By examining the code at that link I discovered the workaround:
Before you try that you should read the comment following
webpackDevServer.config.js#L25
and determine whether that is dangerous for your situation. In my case it’s harmless.