grunt serve VS 在浏览器中打开 index.html答案

【问题标题】：grunt serve VS opening index.html in browsergrunt serve VS 在浏览器中打开 index.html
【发布时间】：2015-09-13 05:50:53
【问题描述】：

我正在使用 Yeoman 和 angular-fullstack 生成器来引导 Angular 应用程序。当我执行grunt serve 或grunt serve:dist 时，一切都按预期进行。

现在的问题是，当我直接在浏览器中打开 index.html 文件时，它不应该同样工作吗？

所以我很难理解 grunt 在这里执行什么任务以使其工作。或者也许我错过了其他东西。

控制台告诉我：

GET file:///app/8d57a97f.app.css net::ERR_FILE_NOT_FOUND
GET file:///app/47ab0f3e.vendor.js net::ERR_FILE_NOT_FOUND
GET file:///app/01b9b8a8.app.js net::ERR_FILE_NOT_FOUND

生成的 index.html 如下所示：

<!doctype html>

  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <base href="/">
    <title></title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width">
    <link rel="stylesheet" href="app/8d57a97f.app.css"/>
  </head>

  <body ng-app="myApp"> 
    <!-- some functionality... -->  
    <script src="app/47ab0f3e.vendor.js"></script>
    <script src="app/01b9b8a8.app.js"></script>
  </body>

</html>

我这样做的原因：

我尝试在 Android 设备上运行带有 phonegap 的 Angular 应用程序。当我将它加载到安卓手机时，屏幕保持空白。于是我在浏览器中打开它，得到了同样的结果。

所以这是我第一次尝试解决这个问题。

【问题讨论】：

您不能对文件进行 AJAX 调用。仅对 HTTP 服务器。因此，从文件系统提供的 Angular 应用程序在进行任何 AJAX 调用后将无法运行。也就是说，您那里的错误只是表明文件不存在。 grunt 服务器可能从多个目录提供文件。
你是对的，现在 GET 是有意义的。但我不明白为什么脚本标签不会在这里检查本地资源。

标签： angularjs cordova gruntjs yeoman

【解决方案1】：

问题在于标题中的<base href="/">。

可以在此处找到说明 (Loading local file in browser referenced css or js)。

【讨论】：