Angular ng serve 不在本地主机上托管站点答案

【问题标题】：Angular ng serve is not hosting site on localhostAngular ng serve 不在本地主机上托管站点
【发布时间】：2020-12-20 05:21:56
【问题描述】：

当我在 CLI 上运行 ng serve 时，我得到以下输出：

Angular Live Development Server 正在监听 localhost:4200，在 http://localhost:4200/ 上打开浏览器

但是当我在浏览器中打开 http://localhost:4200/ 时什么都没有。

关于如何解决这个问题的任何建议？

这是我的package.json

{
  "name": "eastlaw",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^6.1.0",
    "@angular/common": "^6.1.0",
    "@angular/compiler": "^6.1.0",
    "@angular/core": "^6.1.0",
    "@angular/forms": "^6.1.0",
    "@angular/http": "^6.1.0",
    "@angular/platform-browser": "^6.1.0",
    "@angular/platform-browser-dynamic": "^6.1.0",
    "@angular/router": "^6.1.0",
    "core-js": "^2.5.4",
    "rxjs": "6.0.0",
    "zone.js": "~0.8.26"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.7.0",
    "@angular/cli": "~6.1.5",
    "@angular/compiler-cli": "^6.1.0",
    "@angular/language-service": "^6.1.0",
    "@types/jasmine": "~2.8.6",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "~8.9.4",
    "codelyzer": "~4.2.1",
    "jasmine-core": "~2.99.1",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~1.7.1",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.0",
    "karma-jasmine": "~1.1.1",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "~5.4.0",
    "ts-node": "~5.0.1",
    "tslint": "~5.9.1",
    "typescript": "~2.7.2"
  }
}

【问题讨论】：

您的控制台是否有任何错误？
它没有在浏览器上打开，所以我如何检查我的控制台？
@Shankar 网页在我尝试打开时未在我的浏览器上打开，因此页面显示“无法访问此站点”
尝试使用IP地址一次，即http://127.0.0.1:4200，您是否尝试使用ng serve -o
@skdroid 是的，我试过了，但还是不行

标签： html css angular angular-cli

【解决方案1】：

要调试问题，请尝试以下操作：

ng 服务 -o
使用 baseURL 键检查配置文件中提到的默认端口
用 ng build 命令检查（如果 webpack 正在生成）
ng serve --port 8080 --host 0.0.0.0 --disableHostCheck true

如果可能尝试上传浏览器控制台图像

【讨论】：

无法解决同样的问题.. 页面显示“无法访问此站点”

【解决方案2】：

首先，验证您的机器 IP 地址。

在 Windows 上，在提示中键入 ipconfig（复制 IPv4）。在 Mac 上，在终端中输入 ifconfig |grep inet（复制 inet）。

就我而言，这是 192.168.0.10。接下来，输入命令ng serve --host 192.168.0.10 好的，您的应用程序将在同一网络上的所有设备上播出。

现在只有 http://192.168.0.10:4200/ 可以工作，本地主机不行。

【讨论】：

您在执行 ng serve 时是否在终端/CMD 中遇到任何错误，您能否在问题中添加您的 CLI 输出。

【解决方案3】：

考虑这些事情：

通过ng serve打开服务器，只能在该设备上的浏览器。
如果你想为网络上的设备提供服务，你应该使用ng serve -- host <your_device_ip>

注意：设备 IP 是您提供服务的设备的 IP 地址。

【讨论】：

@WebMaster 还要确保您在 root module 和 root module 中指定了 bootstrap component 以在 main.ts 中启动
Windows 防火墙也可能是一个问题，Windows 防火墙会提示您是否允许 NodeJS 访问网络。确保您允许访问。
引导组件不得导致任何连接问题
我知道，但既然他说，屏幕上什么也看不见。也许他没有指出要加载的任何组件的角度。由于控制台没有错误