Question

我无法让我的角应用程序在本地运行。我收到一个错误，我的interview.js和angular.js没有找到。另外，当我从开发控制台打开它时，在interview.js文件中没有定义angular。

这是我的目录结构：

mock
public
    index.html
src
    services
    interview.js
vendor
    angular.js

这是我的index.html

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta http-equiv="x-ua-compatible" content="ie=edge">
  <title>Interview Practice</title>
  <meta name="description" content="">
  <meta name="viewport" content="width=device-width, initial-scale=1">
    <script src="../vendor/angular.js" type="text/javascript"></script>
</head>
<body ng-app="interviewapp">
  hello world!

  <script src="../src/interview.js" type="text/javascript"></script>
</body>
</html>

这是我的interview.js

angular.module("interviewapp", []);
console.log("does this work");

我使用http-server启动应用程序。

Starting up http-server, serving ./public
Available on:
  http://10.66.87.184:8080
  http://192.168.56.1:8080
  http://127.0.0.1:8080

转到localhost或其中列出的任何https，这是我得到的错误：

http://10.66.87.184:8080/vendor/angular.js Failed to load resource: the server responded with a status of 404 (Not Found)
http://10.66.87.184:8080/src/interview.js Failed to load resource: the server responded with a status of 404 (Not Found)

如何修复此问题以便我的应用运行？

Answer 1

如评论中所述：

将src和vendor目录移至public目录，然后从路径开头删除..文件，例如将src="../src/interview.js"更改为src="/src/interview.js"

这是因为您的服务器使用public作为根文件夹，因此它无法看到您尝试访问的其他文件夹。通过将它们移动到public文件夹，它可以访问它们。

Answer 2

将您的项目结构更改为：

mock
public
    index.html
    src
    vendor

也改变了这个：

<script src="../vendor/angular.js" type="text/javascript"></script>

到此：

<script src="/vendor/angular.js" type="text/javascript"></script>

和此：

<script src="../src/interview.js" type="text/javascript"></script>

到这个

<script src="/src/interview.js" type="text/javascript"></script>

所以你的所有javascripts都应该在你的公共目录中。也永远不要使用包含标记的相对路径。公共场所中的任何内容都应该是可访问的，因为它是根文件夹。

Answer 3

您的服务器正在提供public文件夹。因此，可以通过主机名访问该文件夹中的任何内容。但您已将src和vendor放在public的一边，因此它们不会通过您的服务器提供。要访问它们，请将它们放在public文件夹中，然后在js引用之前删除..。

我无法让我的Angular应用在本地运行

3 个答案: