未从 Azure 正确运行 Angular 4 应用程序

Question

我正在研究 angular 4 应用程序。它在我的本地机器上运行良好。当我做服务时，它为应用程序提供http://localhost:4200。由于它是一个 POC 项目，因此没有 api 调用，而是使用服务从 assets/data.json 文件中获取数据。

现在我喜欢将这个站点部署到 azure。当我运行“ng build --env=prod”时，我也得到了 dist 文件夹。我也看到了部署成功的消息。

但是，当我从 azure 运行网站时，它没有正确加载。我启动了开发者工具，看到很多 404 not found 消息。我还附上了屏幕截图。

我不知道为什么这个网站不能正常工作。当我进入本地机器上的 dist 文件夹并运行 index.html 页面时，还有一件事会得到相同的错误消息。

任何帮助表示赞赏。谢谢。

Answer 1

为了避免这些 404 错误，您需要通过web.config在 wwwroot 文件夹中创建一个文件并将以下 MIME 配置放在那里来在 Azure 上提供静态 JSON 和 WOFF 文件。

<?xml version="1.0" encoding="UTF-8" ?>
<configuration>
    <system.webServer>
        <staticContent>
            <remove fileExtension=".json" />
            <remove fileExtension=".woff" />
            <remove fileExtension=".woff2" />
            <mimeMap fileExtension=".json" mimeType="application/json" />
            <mimeMap fileExtension=".woff" mimeType="application/font-woff" />
            <mimeMap fileExtension=".woff2" mimeType="application/font-woff" />      
        </staticContent>
    </system.webServer>
</configuration>