Netlify Dev could not connect to locahost:3000

Yes indeed, the version of Node I am running is v14.17.5.

I’m running v16, and I could not get the project running standalone, let alone with Netlify CLI.

Quick update, I containerized my Node/Create React App environment completely using docker which I figured would isolate any issues that my OS or other software on my computer could be causing and this issue still occurs after seemingly random time intervals. I even tried changing the port of the application from 3000 to 8888 because I found a stack overflow article that said using port 3000 may interfere with webpack. I have been suffering for months now from this and now from what I have gathered it must have to do with my dependencies. Additionally, I upgraded to React 18 to see if that would help and to no avail. Here is my package.json and my webpack config file respectively for additional help solving this issue, I use the “npm run netlify” command to run my app:

{
  "name": "app name",
  "version": "1.0.0",
  "private": true,
  "dependencies": {
    "@craco/craco": "^6.4.3",
    "@paypal/checkout-server-sdk": "^1.0.3",
    "@react-pdf/renderer": "^2.1.2",
    "@sendgrid/mail": "^7.7.0",
    "@testing-library/jest-dom": "^5.16.4",
    "@testing-library/react": "^13.3.0",
    "@testing-library/user-event": "^13.5.0",
    "assert": "^2.0.0",
    "auth0-js": "^9.19.0",
    "aws-sdk": "^2.1149.0",
    "axios": "^0.27.2",
    "browserify-zlib": "^0.2.0",
    "browserslist": "^4.20.3",
    "buffer": "^6.0.3",
    "contentful": "^9.1.32",
    "contentful-management": "^10.6.2",
    "express": "^4.18.1",
    "jwt-decode": "^3.1.2",
    "netlify-lambda": "^2.0.15",
    "process": "^0.11.10",
    "prop-types": "^15.8.1",
    "react": "^18.1.0",
    "react-big-scheduler": "^0.2.6",
    "react-datetime": "^3.1.1",
    "react-dnd": "^5.0.0",
    "react-dnd-html5-backend": "^14.0.1",
    "react-dom": "^18.1.0",
    "react-dropzone": "^14.2.1",
    "react-ga": "^3.3.0",
    "react-icons": "^4.4.0",
    "react-image-file-resizer": "^0.4.8",
    "react-image-gallery": "^1.2.8",
    "react-router-dom": "^6.3.0",
    "react-scripts": "5.0.1",
    "react-stars": "^2.2.5",
    "serverless-http": "^3.0.1",
    "shippo": "^1.7.1",
    "stl-viewer": "^0.12.0",
    "stream-browserify": "^3.0.0",
    "styled-components": "^5.3.5",
    "util": "^0.12.4",
    "uuid": "^8.3.2",
    "web-vitals": "^2.1.4"
  },
  "scripts": {
    "start": "craco start",
    "stop": "taskkill /im node.exe /F",
    "build": "craco build",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "start:lambda": "netlify-lambda serve functions",
    "build:lambda": "netlify-lambda build functions",
    "prod": "npm run build; npm run build:lambda",
    "dev": "npm run start",
    "netlify": "netlify dev",
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "devDependencies": {
    "concurrently": "^7.2.1",
    "netlify-cli": "^10.4.0"
  }
}
const webpack = require("webpack");

module.exports = {
  devServer: {
    host: '0.0.0.0',
    port: 8888,
    server: 'https'
  },
  webpack: {
    configure: {
      resolve: {
        fallback: {
          process: require.resolve("process/browser"),
          zlib: require.resolve("browserify-zlib"),
          stream: require.resolve("stream-browserify"),
          util: require.resolve("util"),
          buffer: require.resolve("buffer"),
          asset: require.resolve("assert"),
        },
      },
      plugins: [
        new webpack.ProvidePlugin({
          Buffer: ["buffer", "Buffer"],
          process: "process/browser",
        }),
      ],
    }
  },
};

@coelmay, I updated the repo to include a dockerfile so you can replicate this as well on your side, just clone the repo, run npm install, then docker build -t netlify-troubleshoot . , and finally docker run -p 3001:3001 -p 8888:8888 --rm -it netlify-troubleshoot:latest

You are starting the dev server on the very port Netlify CLI is going to use, so it never can. The project would not start (using npm start) until I removed this section.

Remove these as they don’t work.

Not needed.

The netlify.toml is wrong:


#[dev]
#  framework = "create-react-app"
#  functionsPort = 3001
# Not required as Netlify CLI will auto-detect the framework

[build]
#  functions = "lambda"
  # There is no `lambda` directory; functions are in the `functions` directory
  functions = "functions"
#  Command = "npm run prod"
  # In line with removing `prod` script, use `build` script
  command = "npm run build"

Once I made all these changes, the project successfully started using Netlify CLI. However, this then throws a URIError: URI malformed when accessed. I am unable to say where this stems from. You may need to file an issue on the Netlify CLI repository: