webpack-dev-server ECONNREFUSED error when using proxy and browser sync

[nated668]

Overview of the issue

After a newly generated JHipster project is created. Main options: Angular, Gradle, H2, Cypress, Gatling, Cucumber. Opened up project in IntelliJ. Started project using Server Play button in the top right menu. Project Compiles Successfully and launches in the browser the Hello World Home page. After Project is launched and running, Webpack dev server starts to throw page errors that stops JavaScript from working on the page. These are 504 Gateway time out errors. It will also throw 404 Page not found errors if additional pages are added.

Stacktrace: [Browsersync] Proxying: http://localhost:4200 [Browsersync] Access URLs:

   Local: http://localhost:9000
External: http://192.168.1.168:9000

---

      UI: http://localhost:3001

UI External: http://localhost:3001

[webpack-dev-server] [HPM] Error occurred while proxying request localhost:9000/api/account to http://localhost:8080/ [ECONNREFUSED] (https://nodejs.org/api/errors.html#errors_common_system_errors) [webpack-dev-server] [HPM] Error occurred while proxying request localhost:9000/management/info to http://localhost:8080/ [ECONNREFUSED] (https://nodejs.org/api/errors.html#errors_common_system_errors) ##### **Motivation for or Use Case** I am trying to create a front end program using ng serve --hmr hot deployment with IntelliJ and Jhipster. This is blocking me from starting my project. I am trying to debug this issue and found no working fixes on stack overflows. ##### **Reproduce the error** ##### **Related issues** ##### **Suggest a Fix** ##### **JHipster Version(s)** ##### **JHipster configuration** INFO! Switching to JHipster installed locally in current project's node repository (node_modules) Welcome to the JHipster Information Sub-Generator ##### **JHipster Version(s)** ``` ang-scm@0.0.1-SNAPSHOT /Users/evdavidoff/Documents/GitlabProjects/ang-scm └── generator-jhipster@7.6.0 ``` ##### **JHipster configuration, a `.yo-rc.json` file generated in the root folder**

.yo-rc.json file

{
  "generator-jhipster": {
    "applicationType": "monolith",
    "authenticationType": "jwt",
    "baseName": "angScm",
    "blueprints": [],
    "buildTool": "gradle",
    "cacheProvider": "ehcache",
    "clientFramework": "angularX",
    "clientPackageManager": "npm",
    "clientTheme": "none",
    "clientThemeVariant": "",
    "creationTimestamp": 1646065557958,
    "cypressCoverage": true,
    "databaseType": "sql",
    "devDatabaseType": "h2Disk",
    "devServerPort": 4200,
    "dtoSuffix": "DTO",
    "enableGradleEnterprise": false,
    "enableHibernateCache": true,
    "enableSwaggerCodegen": false,
    "enableTranslation": true,
    "entitySuffix": "",
    "jhiPrefix": "jhi",
    "jhipsterVersion": "7.6.0",
    "jwtSecretKey": "YourJWTSecretKeyWasReplacedByThisMeaninglessTextByTheJHipsterInfoCommandForObviousSecurityReasons",
    "languages": ["en", "es"],
    "messageBroker": false,
    "nativeLanguage": "en",
    "otherModules": [],
    "packageName": "com.trivalence.angscm",
    "pages": [],
    "prodDatabaseType": "postgresql",
    "reactive": false,
    "searchEngine": false,
    "serverPort": "8080",
    "serverSideOptions": [],
    "serviceDiscoveryType": "no",
    "skipCheckLengthOfIdentifier": false,
    "skipFakeData": false,
    "skipUserManagement": false,
    "testFrameworks": ["cypress", "gatling", "cucumber"],
    "websocket": false,
    "withAdminUi": true
  }
}

##### **JDL for the Entity configuration(s) `entityName.json` files generated in the `.jhipster` directory**

JDL entity definitions

##### **Environment and Tools** openjdk version "17.0.2" 2022-01-18 OpenJDK Runtime Environment Temurin-17.0.2+8 (build 17.0.2+8) OpenJDK 64-Bit Server VM Temurin-17.0.2+8 (build 17.0.2+8, mixed mode) git version 2.35.1 node: v16.14.0 npm: 8.3.1 Docker version 20.10.12, build e91ed57 docker-compose version 1.29.2, build 5becea4c { "generator-jhipster": { "applicationType": "monolith", "authenticationType": "jwt", "baseName": "angScm", "blueprints": [], "buildTool": "gradle", "cacheProvider": "ehcache", "clientFramework": "angularX", "clientPackageManager": "npm", "clientTheme": "none", "clientThemeVariant": "", "creationTimestamp": 1646065557958, "cypressCoverage": true, "databaseType": "sql", "devDatabaseType": "h2Disk", "devServerPort": 4200, "dtoSuffix": "DTO", "enableGradleEnterprise": false, "enableHibernateCache": true, "enableSwaggerCodegen": false, "enableTranslation": true, "entitySuffix": "", "jhiPrefix": "jhi", "jhipsterVersion": "7.6.0", "jwtSecretKey": "", "languages": ["en", "es"], "messageBroker": false, "nativeLanguage": "en", "otherModules": [], "packageName": "com.trivalence.angscm", "pages": [], "prodDatabaseType": "postgresql", "reactive": false, "searchEngine": false, "serverPort": "8080", "serverSideOptions": [], "serviceDiscoveryType": "no", "skipCheckLengthOfIdentifier": false, "skipFakeData": false, "skipUserManagement": false, "testFrameworks": ["cypress", "gatling", "cucumber"], "websocket": false, "withAdminUi": true } } ##### **Entity configuration(s) `entityName.json` files generated in the `.jhipster` directory** none. ##### **Browsers and Operating System** Mac OS Monterey , problem in Google Chrome and Safari. - [x] Checking this box is mandatory (this is just to show you read everything)

[nated668]

Thanks for looking at my issue!

[nated668]

I found the solution. I'll close this issue. Thanks. https://stackoverflow.com/questions/43291477/jhipster-cannot-login-after-starting-with-yarn-start-webpack

[vw98075]

I run into the same issue. After trying a couple of commands mentioned in the stackoverflow, the issue still occurs.