Почему приложение Angular 7 не запускается локально в браузере - PullRequest
0 голосов
/ 30 июня 2019

Обычно все разрабатываемое мной веб-приложение запускается локально в браузерах, использующих файловую систему, при запуске index.html, который затем извлекает все остальные файлы через встроенный скрипт и ссылки css.

Однако, если я попытаюсь сделать то же самое с приложением сборки, созданным Angular's ng build --prod --base-href ./ или же ng build --prod --aot --base-href ./ приложение вообще не запускается.

Интересно, что ошибок консоли нет, и браузер даже загружает все необходимые файлы, как показано ниже.

Почему это происходит? Есть ли какое-либо разрешение?

browsers-network-tab

Редактировать: я знаю, как работает нормальное угловое приложение. Мне просто интересно узнать, в чем причина, несмотря на все необходимые файлы, почему приложение не может быть загружено в браузер традиционным способом.

Ответы [ 2 ]

0 голосов
/ 30 июня 2019

Это потому, что когда вы создаете свое угловое приложение, вы создаете его для базового href. Все ресурсы и т. Д. Относятся к этой базовой ссылке.

Если вы отредактируете базовый href вашего встроенного файла index.html, указав точное местоположение ваших файлов угловых распределений, оно будет работать.

Например, я построил свое приложение так:

ng build --prod --base-href /test/

Файл встроенного индекса:

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Testtalha</title>
  <base href="/test/">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
<link rel="stylesheet" href="styles.3ff695c00d717f2d2a11.css"></head>
<body>
  <app-root></app-root>
<script type="text/javascript" src="runtime.26209474bfa8dc87a77c.js"></script><script type="text/javascript" src="es2015-polyfills.bda95d5896422d031328.js" nomodule></script><script type="text/javascript" src="polyfills.8bbb231b43165d65d357.js"></script><script type="text/javascript" src="main.4eae417d78b7086fd00a.js"></script></body>
</html>

Когда я обновляю базовый href, как я объяснил, он работает в локальном браузере. Как показано ниже:

<base href="./">

РЕДАКТИРОВАТЬ: Я только что понял, что я неправильно понял ваш вопрос. Проверьте этот ответ, если ваша проблема связана с маршрутизацией на локальном браузере без какого-либо сервера. Вам необходимо избавиться от состояния push и предоставить соответствующую базовую ссылку: https://stackoverflow.com/a/45163344/11420760

Но если вы говорите, что ваше приложение даже не открывается и даже не рендерит некоторые вещи, то ваше дело кажется немного сложным. Здесь есть длинная тема, похожее обсуждение: https://github.com/angular/angular/issues/13948

Я предлагаю создать пустой тестовый проект и попробовать то же самое с ним, может быть, таким образом, вы сможете точно определить причину странности в вашем проекте.

0 голосов
/ 30 июня 2019

Команда ng build создает приложение Angular, но не запускает локальный веб-сервер разработки для запуска приложения.

Чтобы собрать и запустить приложение, которое вам нужно запустить,

ng serve

Затем вы можете просмотреть приложение, запущенное в вашем браузере, по адресу http://localhost:4200

...