Question

我是AngularJS的新手。我在哪里放置所有.js文件，如模块，路由和控制器？

我找到了示例，但他们将所有示例放在标记内。

像我目前的代码一样：

<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular-route.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/data.js"></script>
<script src="https://code.highcharts.com/modules/drilldown.js"></script>
<script src="app/app.module.js"></script>
<script src="app/app.routes.js"></script>
<script src="app/components/home/homeController.js"></script>
<script src="app/components/skills/skillsController.js"></script>
</html>

这是正常的吗？或者是否有适当的方式来包含文件？

我听说过RequireJS。但有一种方法没有使用它？

非常感谢。

此致

由里

Answer 1

您可以在结束正文标记</body>之前正常包含文件 - 没关系。

但更有效的方法是将您的文件打包到一个或几个组（库，核心，模块）并缩小。最好减少HTTP请求，因此您应该减少文件数量。

要捆绑文件并缩小，您可以使用gulp或webpack：

请参阅gulp示例： Filesystem Hierarchy Standard

请参阅webpack的示例： https://github.com/jhades/angularjs-gulp-example

Answer 2

没有正确答案。

有多种方法。其中一个正在使用<script>标记作为您的代码。其他选择是：

咕嘟咕嘟
Gulp + Bower
的WebPack
RequireJS
SystemJS

您也可以使用Yeoman来构建具有构建管道的项目。

Answer 3

很少有提示，您应该选择哪些适用于您的应用。

完成所有应用程序标记后，加载脚本。
您可以使用捆绑包，这是我前一段时间创建的初学者项目gulp-browserify-starter。＃1仍然适用。
更加痛苦，并使用webpack将您的供应商和应用程序代码捆绑为不同的捆绑包。

Answer 4

你需要将所有的javascript放在body close标签之前而不是head

<html>
<head></head>
<body>
.......
.......
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular-route.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/data.js"></script>
<script src="https://code.highcharts.com/modules/drilldown.js"></script>
<script src="app/app.module.js"></script>
<script src="app/app.routes.js"></script>
<script src="app/components/home/homeController.js"></script>
<script src="app/components/skills/skillsController.js"></script>
</body>
</html>

AngularJS在哪里放置所有脚本标签的位置

4 个答案: