'Gulp serve is opening a webpage, but it shows page not found error

I am new to sfpx , I started with the intro videos on MS page, I did all the setups but when I run gulp serve it redirects me to "https://localhost:4321/index.html" but browser shows "this site can't be reached" , as well as there is no "index.html" in my local project path. Please help me with possible solutions for this.
Versions of different modules installed:

  • Node - v14.15.0
  • yo - 4.3.0
  • gulp - 4.0.2
  • npm - 6.14.8

    • I am using a gitpod instance for my development, as well as I have tried on my windows device, I got the same errors. Please let me know if any more files or info is required to solve this error then I can share them.
    What I tried:
    based on some blogs I added the environment variable "NODE_NO_HTTP2":1, but this did not solve the problem
    Checked if the port "4321" is not being used by any other services.No service was using this port
    This issue is completely the same/similar to this one "https://stackoverflow.com/questions/70433862/unavailable-hosted-workbench-in-spfx" but I couldn't find a solution over there so reposted my version
    This is the serve.json file content:

    {
  "$schema": "https://developer.microsoft.com/json-schemas/core-build/serve.schema.json",
  "port": 4321,
  "https": true
}

    TIA

    htmlsharepointgulpsharepoint-onlinespfx


    Solution 1:[1]

    The local workbench was deprecated in the latest version of the SPFx tools. You are supposed to use sharepoint online workbench to test your web part. Means, instead of http://localhost:4321 navigate to:

    https://<yoursharepoint>.sharepoint.com/_layouts/15/workbench.aspx

    Maybe you could still use the local workbench using gulp serve-deprecated instead of gulp serve (if it works depends on the version of the SPFx you are using, but soon it won't). Just test on online SharePoint workbench (for that, you need to have online SharePoint of course)

    Sources

    This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

    Source: Stack Overflow

    Solution Source
    Solution 1 Nikolay

    Related Questions