0

Initial issue faced: "Invalid options object. Dev Server has been initialized using an options object that does not match the API schema" TO resolve this issue added setupProxy.js inside src folder as follows:

const { createProxyMiddleware } = require("http-proxy-middleware");

module.exports = function (app) {
  app.use(
    "/",
    createProxyMiddleware({
      target: "http://127.0.0.1:8000",
      changeOrigin: true,
    })
  );
};

After adding this file, the code works fine when built and executed. However, if any changes are made to the JavaScript files, they are not reflected in the UI when saved and compiled using 'npm start'. The changes only appear when 'npm start' is executed after rebuilding with 'npm run build'.

  • Tried different versions of npm and react-script.
  • Removed node modules and installed again.

Expecting a solution to make the changes made in code to reflect in UI without rebuilding the code everytime.

Improve this question
2
  • It's hard to tell what is going on because you did not show what your npm start command is doing, but I think you are going to want something like nodemon: npmjs.com/package/nodemon If you do not want an extra package and you are on node >=20 you could use the built in watch command. nodejs.org/docs/v20.15.1/api/cli.html#--watch
    – Frank
    Commented Jul 9 at 18:01
  • Currently using node version is 16.4.2 and the npm start command works as like below: #package.json "scripts": { "start": "react-scripts start", "build": "react-scripts build", "test": "react-scripts test", "eject": "react-scripts eject" } Tried after installing nodemon, still the changes are reflecting only when build using npm run build and restarting nodemon.
    – Nivedha
    Commented Jul 10 at 5:11

1 Answer 1

Reset to default
0

The issue may be due to the inclusion of setupProxy.js. Remove that file and try by adding a proxy in package.json. If the error persists try with higher node and npm versions.

Improve this answer

Not the answer you're looking for? Browse other questions tagged or ask your own question.