index.html中有多个脚本链接

Question

index.html中有多个脚本链接

我在Angular有一个小项目.我试图以一种单一责任的方式保持一切,我对我的应用程序结构非常满意.我觉得唯一不太好看的是index.html.所有js文件都包含在文件的底部,我不喜欢它的外观.我正在添加更多文件(控制器,服务等),列表可能会长得很长.

所以我的问题是:这是正常的,索引文件包含所有这些还是有办法将所有这些都移到一个文件中并在index.html中引用它？

<html>
<head>
    ...
</head>
<body>
    ...

    ...


<script src="assets/js/angular.js"></script>
<script src="assets/js/angular-route.js"></script>
<script src="assets/js/angular-touch.js"></script>
<script src="assets/js/angular-sanitize.js"></script>
<script src="assets/js/angular-animate.min.js"></script>
<script src="assets/js/jquery-2.1.3.min.js"></script>
<script src="assets/js/bootstrap.min.js"></script>

<script src="app/app.js"></script>
<script src="app/app.routes.js"></script>
<script src="controllers/controllerOne.js"></script>
<script src="controllers/controllerTwo.js"></script>
<script src="controllers/controllerThree.js"></script>
<script src="directives/directiveOne.js"></script>
<script src="directives/directiveTwo.js"></script>
<script src="services/serviceOne.js"></script>
<script src="services/serviceTwo.js"></script>
<script src="services/serviceThree.js"></script>

</body>
</html>

Run Code Online (Sandbox Code Playgroud)

2015年4月4日更新

我最终使用了Gulp.对于那些在这方面寻求帮助的人,我已经关注了这个小教程:https://medium.com/@dickeyxxx/best-practices-for-building-angular-js-apps-266c1a4a6917

Answer 1

Or *_*Guz 7

我知道几种可能的解决方案会自动为index.html注入脚本标记:

使用Gulp - 任务/构建运行器.您可以使用Gulp-Inject,它是:

gulp的样式表,javascript和webcomponent引用注入插件
Grunt - JavaScript任务运行器您可以使用Grunt-Injector:

将对文件的引用注入其他文件(将脚本和样式表视为html文件)
我没有使用的另一个选项是RequireJS.请参阅 - http://www.startersquad.com/blog/angularjs-requirejs/

您可以在Gulp vs Grunt上找到许多讨论,两者都会让您的生活更轻松并解决您的问题.

看到:

Grunt vs Gulp

另一个Grunt vs Gulp

归档时间：	10 年，9 月前
查看次数：	4708 次
最近记录：	9 年，10 月前