Azure / static-web-apps-cli

Azure Static Web Apps CLI ✨
https://aka.ms/swa/cli-local-development
MIT License
585 stars 112 forks source link

[start] Start command does not connect to web or api server on Node 18 #663

Open sinedied opened 1 year ago

sinedied commented 1 year ago

Before filing this issue, please ensure you're using the latest CLI by running swa --version and comparing to the latest version on npm.

Are you accessing the CLI from the default port :4280 ?

Make sure you are accessing the URL printed in the console when running swa start!

ℹ️ NOTE: Make sure to enable debug logs when running any swa commands using --verbose=silly

Describe the bug On Node 18, npm start never connects to a web or api server, it's stuck until timeout. On Node 16, no issue.

This is related to this issue https://github.com/jeffbski/wait-on/issues/137 of the wait-on package.

sgollapudi77 commented 1 year ago

Hi @sinedied , is there any alternative that we can use instead of "wait-on" package?

rodyvansambeek commented 1 year ago

As a temporary workaround you can use 127.0.0.1 in stead of localhost for the API and/or for the frontend, use it like this:

swa start --host=127.0.0.1 --app-devserver-url=http://127.0.0.1:3010

Mind that the port number 3010 can be different on your side of course, and you should add your own extra parameters.

sinedied commented 1 year ago

Hi @sinedied , is there any alternative that we can use instead of "wait-on" package?

None that I know of. This is problematic in the whole Node.js ecosystem as they made the changed the priority order from ipv4 to ipv6. We could work around that on our side but it would be a bit convoluted (trying both localhost and 127.0.0.1, and connecting to the first one that succeed.

As a temporary workaround you can use 127.0.0.1 in stead of localhost for the API and/or for the frontend, use it like this:

swa start --host=127.0.0.1 --app-devserver-url=http://127.0.0.1:3010

Mind that the port number 3010 can be different on your side of course, and you should add your own extra parameters.

You're right, but the --host isn't needed, only --app-devserver-url=http://127.0.0.1:<PORT> or --api-devserver-url=http://127.0.0.1:<PORT>.

One issue is that once the --api-devserver-url option is set, the Function API emulator doesn't start automatically anymore and need to be run manually.

rodyvansambeek commented 1 year ago

One issue is that once the --api-devserver-url option is set, the Function API emulator doesn't start automatically anymore and need to be run manually.

You are right, but that's why you include the --host in combination with the --api-location option (and not the --api-devserver-url option), in my example I omitted the api-location option, but it should look something like:

swa start --host=127.0.0.1 --app-devserver-url=http://127.0.0.1:<DEVSERVER-PORT> --run "<RUN COMMAND>" --api-location ./api --port <SWA-PORT> --api-port <API-PORT>
sgollapudi77 commented 1 year ago

One issue is that once the --api-devserver-url option is set, the Function API emulator doesn't start automatically anymore and need to be run manually.

You are right, but that's why you include the --host in combination with the --api-location option (and not the --api-devserver-url option), in my example I omitted the api-location option, but it should look something like:

swa start --host=127.0.0.1 --app-devserver-url=http://127.0.0.1:<DEVSERVER-PORT> --run "<RUN COMMAND>" --api-location ./api --port <SWA-PORT> --api-port <API-PORT>

This is so painful from user perspective, may be we should try giving these params internally while starting the swa if the node version is 18.

rodyvansambeek commented 1 year ago

One issue is that once the --api-devserver-url option is set, the Function API emulator doesn't start automatically anymore and need to be run manually.

You are right, but that's why you include the --host in combination with the --api-location option (and not the --api-devserver-url option), in my example I omitted the api-location option, but it should look something like:

swa start --host=127.0.0.1 --app-devserver-url=http://127.0.0.1:<DEVSERVER-PORT> --run "<RUN COMMAND>" --api-location ./api --port <SWA-PORT> --api-port <API-PORT>

This is so painful from user perspective, may be we should try giving these params internally while starting the swa if the node version is 18.

Agreed that it's painful from a user perspective, but the problem is in the related package wait-on which resolves to the ::1 IPv6 address. I don't think it's a SWA-CLI specific issue.

sinedied commented 1 year ago

This is so painful from user perspective, may be we should try giving these params internally while starting the swa if the node version is 18.

We can't do that, as some servers listen on ipv6 by default and works fine with http://localhost, but would break with http://127.0.0.1 (Node.js server running on Node 18 for example).

Psvensso commented 1 year ago

Another workaround to get people going with node 18.

Using swa 1.1.1 and Node 18.12.1 i was able to get everything to work as expected with

swa start --host=127.0.0.1 --port=3010 --app-devserver-url=http://127.0.0.1:3000

My react apps runs on 3000 (Vite React) And my public facing endpoint (swa) i now accessible on 3010

jamesclancy commented 1 year ago

I was getting this issue on Win 11. I switched to running the swa start in WSL and it is working for me again with node 18.

johnnyreilly commented 1 year ago

Thought I'd share my own workaround. I installed concurrently:

npm i concurrently

Then I separated out my front end / back end scripts like so:

    "debug": "concurrently -n \"staticwebapp,functionapp\" -c \"bgBlue.bold,bgMagenta.bold\" \"npm run debug:staticwebapp\" \"npm run debug:functionapp\"",
    "debug:staticwebapp": "cd src/StaticWebApp && npm run debug",
    "debug:functionapp": "cd src/FunctionApp && func start",

Where the npm run debug in src/StaticWebApp is:

        "debug": "swa start http://localhost:5173 --run \"npm run dev\" --api-location http://127.0.0.1:7071",

This allows me to work around the issue.

https://johnnyreilly.com/static-web-apps-cli-node-18-could-not-connect-to-api

cjk7989 commented 1 year ago

This is so painful from user perspective, may be we should try giving these params internally while starting the swa if the node version is 18.

We can't do that, as some servers listen on ipv6 by default and works fine with http://localhost, but would break with http://127.0.0.1 (Node.js server running on Node 18 for example).

Can Node.js server successfully listen on localhost (resolved to ipv6)? In fact, I find "server.listen()" can not listen on ipv6 hosts like [::1]:4280, while listen on 127.0.0.1 works well.

jezmaghuyop commented 1 year ago

the work around the worked for me was with my Angular application

  1. Create a swa-cli.config.json in the root and add the following config
{
  "configurations": {
    "app": {
      "host": "127.0.0.1",
      "appLocation": "dist/angular-app",
      "apiLocation": "api"
    }
  }
}
  1. then just run swa start
cjk7989 commented 1 year ago

We release swa-cli v1.1.3 and the issue has been fixed in PR #704. If you encounter any problems, please feel free to continue the discussion here.

jorgelevy commented 1 year ago

I'm still getting the error with version 1.1.3. I'm using nvm for Windows and node 18.16.1. But if I switch to node 16.20.1 everything works as expected.

cjk7989 commented 1 year ago

I'm still getting the error with version 1.1.3. I'm using nvm for Windows and node 18.16.1. But if I switch to node 16.20.1 everything works as expected.

Is there any detailed error message? You can run swa start with augment "--verbose=silly" to see it. What's more, does it work if you use "--host=127.0.0.1"?

jorgelevy commented 1 year ago

I'm still getting the error with version 1.1.3. I'm using nvm for Windows and node 18.16.1. But if I switch to node 16.20.1 everything works as expected.

Is there any detailed error message? You can run swa start with augment "--verbose=silly" to see it. What's more, does it work if you use "--host=127.0.0.1"?

My logs:

➜ swa start --verbose=silly

Welcome to Azure Static Web Apps CLI (1.1.3)

Getting config file options from swa-cli.config.json... Changed directory to D:\Src\ToDelete\my-app-angular Using configuration "my-app-angular" from file: D:\Src\ToDelete\my-app-angular\swa-cli.config.json


Checking if localhost:4280 is accepting TCP connections... Port 4280 is available. Use it. Resolved port number: 4280 appDevserverUrl provided, we will try connect to dev server at dist\my-app-angular Api Folder found: D:\Src\ToDelete\my-app-angular\api Trying to read workflow config with values:

➜ swa start --host=127.0.0.1

Welcome to Azure Static Web Apps CLI (1.1.3)

Using configuration "my-app-angular" from file: D:\Src\ToDelete\my-app-angular\swa-cli.config.json


[api] MSBuild version 17.7.0-preview-23273-06+7d65cb31c for .NET [swa] - Waiting for http://localhost:4200 to be ready [api] Determining projects to restore... [run] [run] > my-app-angular@0.0.0 start [run] > ng serve [run] [api] All projects are up-to-date for restore. [api] C:\Program Files\dotnet\sdk\7.0.400-preview.23274.1\Current\SolutionFile\ImportAfter\Microsoft.NET.Sdk.Solution.targets(36,5): warning NETSDK1194: The "--output" option isn't supported when building a solution. Specifying a solution-level output path results in all projects copying outputs to the same directory, which can lead to inconsistent builds. [D:\Src\ToDelete\my-app-angular\api\api.sln] [api] C:\Program Files\dotnet\sdk\7.0.400-preview.23274.1\Sdks\Microsoft.NET.Sdk\targets\Microsoft.NET.RuntimeIdentifierInference.targets(287,5): message NETSDK1057: You are using a preview version of .NET. See: https://aka.ms/dotnet-support-policy [D:\Src\ToDelete\my-app-angular\api\api.csproj] [api] api -> D:\Src\ToDelete\my-app-angular\api\bin\output\api.dll [run] - Generating browser application bundles (phase: setup)... [api] Determining projects to restore... [api] Restored C:\Users\jorge\AppData\Local\Temp\lbfslhyg.a3g\WorkerExtensions.csproj (in 515 ms). [api] WorkerExtensions -> C:\Users\jorge\AppData\Local\Temp\lbfslhyg.a3g\buildout\Microsoft.Azure.Functions.Worker.Extensions.dll [api] [api] Build succeeded. [api] [api] C:\Program Files\dotnet\sdk\7.0.400-preview.23274.1\Current\SolutionFile\ImportAfter\Microsoft.NET.Sdk.Solution.targets(36,5): warning NETSDK1194: The "--output" option isn't supported when building a solution. Specifying a solution-level output path results in all projects copying outputs to the same directory, which can lead to inconsistent builds. [D:\Src\ToDelete\my-app-angular\api\api.sln] [api] 1 Warning(s) [api] 0 Error(s) [api] [api] Time Elapsed 00:00:05.73 [api] [api] [api] [api] Azure Functions Core Tools [api] Core Tools Version: 4.0.5198 Commit hash: N/A (64-bit) [api] Function Runtime Version: 4.21.1.20667 [api] [api] [2023-06-25T05:24:48.787Z] Found D:\Src\ToDelete\my-app-angular\api\api.csproj. Using for user secrets file configuration. [api] [api] Functions: [api] [api] HttpExample: [GET,POST] http://localhost:7071/api/HttpExample [api] [api] For detailed output, run func with --verbose flag. [run] ✔ Browser application bundle generation complete. [run] [run] Initial Chunk Files | Names | Raw Size [run] vendor.js | vendor | 1.97 MB | [run] polyfills.js | polyfills | 332.99 kB | [run] styles.css, styles.js | styles | 230.29 kB | [run] main.js | main | 46.00 kB | [run] runtime.js | runtime | 6.53 kB | [run] [run] | Initial Total | 2.57 MB [run] [run] Build at: 2023-06-25T05:24:50.298Z - Hash: ed1fa4e3aab21ffa - Time: 3308ms [run] [run] Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ [run] [run] [run] √ Compiled successfully. [api] [2023-06-25T05:24:50.882Z] Worker process started and initialized. [swa] ✖ Waiting for http://localhost:4200 to be ready [swa] ✖ Could not connect to "http://localhost:4200". Is the server up and running? [swa] node "C:\Users\jorge\AppData\Roaming\nvm\v18.16.1\node_modules\@azure\static-web-apps-cli\dist\msha\server.js" exited with code 0 --> Sending SIGTERM to other processes.. [api] cd "D:\Src\ToDelete\my-app-angular\api" && "func" start --cors "*" --port 7071 exited with code 1 --> Sending SIGTERM to other processes.. [run] cd "D:\Src\ToDelete\my-app-angular" && npm start exited with code 1 ✖ SWA emulator stoped because the --run command exited with code 1. NativeCommandExitException: Program "node.exe" ended with non-zero exit code: 1.

➜ swa start --host=127.0.0.1 --verbose=silly

Welcome to Azure Static Web Apps CLI (1.1.3)

Getting config file options from swa-cli.config.json... Changed directory to D:\Src\ToDelete\my-app-angular Using configuration "my-app-angular" from file: D:\Src\ToDelete\my-app-angular\swa-cli.config.json


Checking if 127.0.0.1:4280 is accepting TCP connections... Port 4280 is available. Use it. Resolved port number: 4280 appDevserverUrl provided, we will try connect to dev server at dist\my-app-angular Api Folder found: D:\Src\ToDelete\my-app-angular\api Trying to read workflow config with values:

jochenjonc commented 1 year ago

I also still have this issue with Node 18. When I start my dev server manually before executing swa start then it works perfectly, but if I do swa start first and then start my dev server, swa never connects.

cjk7989 commented 1 year ago

Hi @jorgelevy and @jochenjonc, thanks for your feedback. We solved this issue in #720, now dev servers can be reached, and there is no need to set --host=127.0.0.1.

Before a new version of swa-cli is released, you can feel free to download and test it from GitHub. Here are the steps: 1) git clone https://github.com/Azure/static-web-apps-cli.git 2) cd into the folder "static-web-apps-cli" 3) run "npm install", then "npm run build" 4) run "npm link ./", which allows you to use this version of swa-cli globally. 5) * if you want to update the version of swa-cli, just delete this local folder "static-web-apps-cli" and run "npm install -g @azure/static-web-apps-cli" to reinstall the official version.

Happy to know if it is ok or still have any problems.

jochenjonc commented 1 year ago

@cjk7989 I've tested it and it is fixed. 👍

Can't wait for the release.

johnnyreilly commented 1 year ago

Please could the fix be released?

jorgelevy commented 1 year ago

Hi @jorgelevy and @jochenjonc, thanks for your feedback. We solved this issue in #720, now dev servers can be reached, and there is no need to set --host=127.0.0.1.

Before a new version of swa-cli is released, you can feel free to download and test it from GitHub. Here are the steps:

  1. git clone https://github.com/Azure/static-web-apps-cli.git
  2. cd into the folder "static-web-apps-cli"
  3. run "npm install", then "npm run build"
  4. run "npm link ./", which allows you to use this version of swa-cli globally.
    • if you want to update the version of swa-cli, just delete this local folder "static-web-apps-cli" and run "npm install -g @azure/static-web-apps-cli" to reinstall the official version.

Happy to know if it is ok or still have any problems.

Working for me as well, thank you!

cjk7989 commented 11 months ago

We are happy to inform you that a new release has been published that fixed the issue. Please update swa-cli to v1.1.4 and let us know if you encounter any issues. Thanks for your feedback and support.

nerblock commented 11 months ago

With the latest version (v1.1.4) I get a lot of log spam:

[swa] Timed out waiting for: tcp:127.0.0.1:4200
[swa] Timed out waiting for: tcp:127.0.0.1:4200
[swa] Timed out waiting for: tcp:127.0.0.1:4200
[swa] Timed out waiting for: tcp:127.0.0.1:4200
[swa] Timed out waiting for: tcp:127.0.0.1:4200
[swa] Timed out waiting for: tcp:127.0.0.1:4200
[swa] Timed out waiting for: tcp:127.0.0.1:4200
[swa] Timed out waiting for: tcp:127.0.0.1:4200
[swa] Timed out waiting for: tcp:127.0.0.1:4200
[swa] Timed out waiting for: tcp:127.0.0.1:4200
[swa] Timed out waiting for: tcp:127.0.0.1:4200
[swa] Timed out waiting for: tcp:127.0.0.1:4200
[swa] Timed out waiting for: tcp:127.0.0.1:4200
[swa] Timed out waiting for: tcp:127.0.0.1:4200
[swa] Timed out waiting for: tcp:127.0.0.1:4200
[swa] Timed out waiting for: tcp:127.0.0.1:4200
[swa] Timed out waiting for: tcp:127.0.0.1:4200

The site works as expected though, nothing is broken, but I have no idea why 127.0.0.1 is there. I use localhost in the startup command:

swa start http://localhost:4200 --api-location ./api
jorgelevy commented 11 months ago

Working for me. Thanks!!

Needed to update my npm and uninstall all my packages (angular, swa cli, and azure functions cli), and install new packages versions.

rsaarloos commented 11 months ago

It works for me as well, the main problem is that the performance of the site is terrible when compared not running through swa cli. Pages take long time to load and resources (for example > 1s to load a font)

JonSilver commented 10 months ago

It works for me as well, the main problem is that the performance of the site is terrible when compared not running through swa cli. Pages take long time to load and resources (for example > 1s to load a font)

It's getting quite tedious waiting for a fix, tbh.

ArmaanMcleod commented 8 months ago

When will this be fixed?

I keep getting the below in 1.1.4

[swa] ✖ Error: "localhost" can not be resolved to either IPv4 or IPv6. Please check your network settings.

workaround of using 127.0.0.1 works.

This worked fine in 1.0.2, but VSCode keeps telling me to upgrade to latest version 😄.

cjk7989 commented 8 months ago

When will this be fixed?

I keep getting the below in 1.1.4

[swa] ✖ Error: "localhost" can not be resolved to either IPv4 or IPv6. Please check your network settings.

workaround of using 127.0.0.1 works.

This worked fine in 1.0.2, but VSCode keeps telling me to upgrade to latest version 😄.

Hi @ArmaanMcleod, the connection issue should have been fixed from 1.1.4. I guess it may due to your network failure of 127.0.0.1. But I can help you find the reason. Could you provide the framework type of your app, swa-cli.config.json (if you have) and your command to run swa-cli?

ArmaanMcleod commented 8 months ago

Hi @cjk7989. Thanks for your response. Looks like the issue fixed itself when I upgraded my node version to latest 🙂.

jacksorjacksor commented 8 months ago

Hi @cjk7989. Thanks for your response. Looks like the issue fixed itself when I upgraded my node version to latest 🙂.

As I'm encountering this issue using Node 16.16.0 could I confirm which version of Node you're now using? TIA!

jacksorjacksor commented 8 months ago

I have a Blazor WASM project with a database connection to a local CosmosDB emulator. Upon swa start the [swa] never connects and so never creates the Port:4280, and so never creates the /data-api/graphql endpoint. The following is the end of the log, with the specific [swa] errors:

[swa] ✖ Waiting for http://localhost:8000 to be ready
[swa] ✖ Could not connect to "http://localhost:8000". Is the server up and running?
[swa] node "C:\Users\jacks\AppData\Roaming\nvm\v18.18.2\node_modules\@azure\static-web-apps-cli\dist\msha\server.js" exited with code 0
--> Sending SIGTERM to other processes..
[run] cd "D:\Coding\dab\EIT\Blazor.GraphQl.Attempt.01\frontend" && dotnet watch run exited with code 1
--> Sending SIGTERM to other processes..
[dataApi] cd "D:\Coding\dab\EIT\Blazor.GraphQl.Attempt.01\data" && "C:\Users\jacks\.swa\dataApiBuilder\0.8.52\Microsoft.DataApiBuilder.exe" start -c staticwebapp.database.config.json --no-https-redirect exited with code 1
✖ SWA emulator stoped because Data API server exited with code 1.

Could anyone give any guidance on what might be the problem? I've tried swapping out Node 18-16 and back, and am using SWA CLI 1.1.4. TIA!

cjk7989 commented 8 months ago

I have a Blazor WASM project with a database connection to a local CosmosDB emulator. Upon swa start the [swa] never connects and so never creates the Port:4280, and so never creates the /data-api/graphql endpoint. The following is the end of the log, with the specific [swa] errors:

[swa] ✖ Waiting for http://localhost:8000 to be ready
[swa] ✖ Could not connect to "http://localhost:8000". Is the server up and running?
[swa] node "C:\Users\jacks\AppData\Roaming\nvm\v18.18.2\node_modules\@azure\static-web-apps-cli\dist\msha\server.js" exited with code 0
--> Sending SIGTERM to other processes..
[run] cd "D:\Coding\dab\EIT\Blazor.GraphQl.Attempt.01\frontend" && dotnet watch run exited with code 1
--> Sending SIGTERM to other processes..
[dataApi] cd "D:\Coding\dab\EIT\Blazor.GraphQl.Attempt.01\data" && "C:\Users\jacks\.swa\dataApiBuilder\0.8.52\Microsoft.DataApiBuilder.exe" start -c staticwebapp.database.config.json --no-https-redirect exited with code 1
✖ SWA emulator stoped because Data API server exited with code 1.

Could anyone give any guidance on what might be the problem? I've tried swapping out Node 18-16 and back, and am using SWA CLI 1.1.4. TIA!

Hi @jacksorjacksor, both node 16 and 18 are supported in swa-cil@v1.1.4.

Firstly I suggest to check whether your Blazor WASM project starts the dev server localhost:8000 successfully before swa-cli try to connect to it. You can just run the start up command and check if the app runs on localhost:8000. The start up command for you seems to be: cd "D:\Coding\dab\EIT\Blazor.GraphQl.Attempt.01\frontend" && dotnet watch run

jacksorjacksor commented 8 months ago

Hi @cjk7989 thanks for this - yes this runs the Blazor app but on port 5296 - I'll look to change that to 8000 and get back to you

jacksorjacksor commented 8 months ago

YES that was it! Huge apologies, thank you!! Oh that's really obvious in retrospect.

Ports changed from 5296 -> 8000 in launchSettings.json.

...the next issue being that http://localhost:4280/data-api/graphql/ is returning "Sorry, there's nothing at this address." but that's a separate issue. OK thanks for that guidance.

cjk7989 commented 8 months ago

Hi @cjk7989 thanks for this - yes this runs the Blazor app but on port 5296 - I'll look to change that to 8000 and get back to you

That's ok. Or you can add a parameter of swa-cli: "--appDevserverUrl http://localhost:5296" or add this to swa-cli.config.json generated by "swa init".

johnnyreilly commented 8 months ago

It's suggested here: https://github.com/jeffbski/wait-on/issues/137#issuecomment-1775289798

That the issue may not arise with Node.js 20. possibly worth testing if upgrading to 20 removes the issue

johnnyreilly commented 3 weeks ago

Thanks to @bzbetty for suggesting, there is a way to improve performance (or perhaps work around the SWA CLI perf regression since 1.1.4). I've written it up here: https://johnnyreilly.com/static-web-apps-cli-improve-performance-with-vite-server-proxy