Question

当与ng serve命令或ng serve --prod命令一起使用时，我的应用程序运行良好，但是当我使用ng build --prod命令将其构建用于生产，然后与{{ 1}}命令或使用http-server -p 8080 -c-1 dist/ng-zero命令，任何请求都具有live-server --entry-file=dist/index.html响应。

我在这里查看了不同的问题及其答案，但没有任何帮助。我尝试了404的建议，也尝试了HashLocationStrategy的建议，但没有成功。

启动应用程序的Http服务器：

useHash: true

它确实在$ http-server -p 8080 -c-1 dist/ng-zero Starting up http-server, serving dist/ng-zero Available on: http://127.0.0.1:8080 http://192.168.0.7:8080 http://172.19.0.1:8080 Hit CTRL-C to stop the server [Sat Oct 13 2018 11:19:38 GMT+0200 (CEST)] "GET /" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36" [Sat Oct 13 2018 11:19:38 GMT+0200 (CEST)] "GET /" Error (404): "Not found"上打开了一个新的浏览器选项卡，但它为空白，控制台显示：

http://127.0.0.1:8080/

启动应用程序的Lite服务器：

[Sat Oct 13 2018 11:19:38 GMT+0200 (CEST)] "GET /" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36"
[Sat Oct 13 2018 11:19:38 GMT+0200 (CEST)] "GET /" Error (404): "Not found"
[Sat Oct 13 2018 11:20:51 GMT+0200 (CEST)] "GET /" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36"
[Sat Oct 13 2018 11:20:51 GMT+0200 (CEST)] "GET /" Error (404): "Not found"

它确实在$ ll dist/index.html -rw-rw-r-- 1 stephane 925 oct. 12 19:35 dist/index.html [stephane@stephane-ThinkPad-X201 ng-zero (master)] $ live-server --entry-file=dist/index.html Serving "/home/stephane/dev/js/projects/angular/ng-zero" at http://127.0.0.1:8080上打开了一个新的浏览器选项卡，但它为空白，控制台什么也没说。

http://127.0.0.1:8080/文件：

index.html

编辑：

这是文件夹结构：

$ cat src/index.html
<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>NgZero</title>
  <base href="/">

  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
  <link rel="manifest" href="manifest.json">
  <meta name="theme-color" content="#1976d2">
</head>
<body class="mat-app-background">
  <app-root></app-root>
  <noscript>Please enable JavaScript to continue using this application.</noscript>
</body>
</html>

我正在使用Angular 7 $ tree . ├── app │ ├── app.component.css │ ├── app.component.html │ ├── app.component.spec.ts │ ├── app.component.ts │ ├── app-gui.module.ts │ ├── app.module.ts │ ├── app-preloading-strategy.ts │ ├── app-routing.module.ts │ ├── core │ │ ├── auth │ │ │ ├── auth-guard.service.ts │ │ │ ├── auth.interceptor.ts │ │ │ ├── auth.module.ts │ │ │ ├── auth.service.ts │ │ │ ├── keycloak-client.service.spec.ts │ │ │ ├── keycloak-client.service.ts │ │ │ ├── keycloak.interceptor.ts │ │ │ ├── token.service.spec.ts │ │ │ └── token.service.ts │ │ ├── error │ │ │ ├── error.component.html │ │ │ ├── error.component.scss │ │ │ ├── error.component.ts │ │ │ ├── error-custom-handler.ts │ │ │ ├── error.module.ts │ │ │ ├── error-request-interceptor.ts │ │ │ ├── error-routing.module.ts │ │ │ ├── error.service.ts │ │ │ └── index.ts │ │ ├── login │ │ │ ├── login.component.css │ │ │ ├── login.component.html │ │ │ ├── login.component.spec.ts │ │ │ ├── login.component.ts │ │ │ ├── login-dialog.component.html │ │ │ └── login-dialog.component.ts │ │ ├── messages │ │ │ ├── messages.component.css │ │ │ ├── messages.component.html │ │ │ ├── messages.component.spec.ts │ │ │ ├── messages.component.ts │ │ │ ├── message.service.spec.ts │ │ │ └── message.service.ts │ │ └── service │ │ ├── http.service.ts │ │ ├── notification.service.ts │ │ ├── pagination.service.ts │ │ └── utils.service.ts │ ├── core.module.ts │ ├── material.module.ts │ └── views │ ├── dashboard │ │ ├── dashboard.component.css │ │ ├── dashboard.component.html │ │ ├── dashboard.component.spec.ts │ │ └── dashboard.component.ts │ ├── home │ │ ├── home.component.css │ │ ├── home.component.html │ │ ├── home.component.spec.ts │ │ ├── home.component.ts │ │ ├── home.module.ts │ │ └── home-routing.module.ts │ └── user │ ├── search.component.css │ ├── search.component.html │ ├── search.component.spec.ts │ ├── search.component.ts │ ├── user.component.css │ ├── user.component.html │ ├── user.component.spec.ts │ ├── user.component.ts │ ├── users.component.css │ ├── users.component.html │ ├── users.component.spec.ts │ ├── users.component.ts │ ├── user.service.spec.ts │ ├── user.service.ts │ └── user.ts ├── assets │ └── icons │ ├── icon-128x128.png │ ├── icon-144x144.png │ ├── icon-152x152.png │ ├── icon-192x192.png │ ├── icon-384x384.png │ ├── icon-512x512.png │ ├── icon-72x72.png │ └── icon-96x96.png ├── environments │ ├── environment.prod.ts │ └── environment.ts ├── favicon.ico ├── index.html ├── main.ts ├── manifest.json ├── polyfills.ts ├── styles.css ├── test.ts ├── tsconfig.app.json ├── tsconfig.spec.json └── typings.d.ts

Answer 1

ng build --prod命令将所有必需的文件推送到/dist文件夹下。您只需要将这些文件复制到服务器中。

如果您要提供/dist文件夹中的内容

安装angular-http-server
按照angular-http-server --path dist/

当应用程序在外部服务器上运行时，找不到所有请求（404）

1 个答案: