angular-cli 构建没有网络服务器

Question

上周我开始使用 Angular 2 通过 Angular-Cli 创建的作品集网站。这个作品集网站是一项学校作业。

最终要求之一是网站可以运行没有网络服务器。

当我在网络服务器上打开网站时（在使用 ng build 构建网站后），加载它完全没有问题。但是当我在浏览器中本地打开它时，我收到每个 javascript 文件上找不到的 404 文件。

这些 javascript 文件与下面显示的索引页位于同一目录中。

这是我的 index.hmtl 由 ng build 生成的。

<!doctype html>
<html>
<head>
  <meta charset="utf-8">
  <title>Hallo, ik ben Maarten.</title>
  <base href="/">

  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="assets/favicon.ico">

  <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,700" rel="stylesheet">
</head>
<body>
<app-root>Loading...</app-root>
<script type="text/javascript" src="inline.js"></script>
<script type="text/javascript" src="styles.bundle.js"></script>
<script type="text/javascript" src="scripts.bundle.js"></script>
<script type="text/javascript" src="main.bundle.js"></script>
</body>
</html>

但是在浏览器中打开索引文件时找不到文件。

是否可以在没有网络服务器的情况下使用 Angular-Cli 运行构建 Angular 2 项目？

谢谢，

马丁·帕乌

Answer 1

由于 <base href="/"> 标记，文件加载失败。它会重写所有 file:// 请求，因此它们开始引用不存在的文件。

ng-cli提供了一个--base-href configuration option，可以设置为./，这样链接就可以继续工作了：

ng build --base-href "./"

angular-cli 构建没有网络服务器

angular-cli build without a webserver

angular-cli

angular