ember.js加载多个css和js文件的最佳方式

Question

我正在创建一个ember应用程序。现在我加载所有的JS和CSS文件index.html文件是这样的：

<link type="text/css" rel="stylesheet" href="assets/css/gumby.css" media="all" /> 
<link type="text/css" rel="stylesheet" href="assets/css/pages/global.css" media="all" /> 
<link type="text/css" rel="stylesheet" href=assets/css/tooltipster.css" media="screen" /> 
<link type="text/css" rel="stylesheet" href="assets/css/jquery.fancybox.css" media="screen" /> 
<link type="text/css" rel="stylesheet" href="assets/css/pages/about.css" media="screen" /> 
<link type="text/css" rel="stylesheet" href="assets/css/pages/admin.css" media="screen" /> 
<link type="text/css" rel="stylesheet" href="assets/css/pages/global_print.css" media="print" /> 

js文件：

<script src="assets/js/libs/jquery-1.9.0.min.js"></script> 
<script src="js/libs/handlebars-1.1.2.js"></script> 
<script src="js/libs/ember-1.6.1.js"></script> 
<script src="js/libs/ember-data.js"></script> 
<script src="js/app.js"></script> 
<script src="js/router.js"></script> 
<script src="js/account.js"></script> 
<script src="js/message.js"></script> 
<script src="js/user.js"></script> 
<script src="js/inquiry.js"></script> 

我知道它不加载所有的js和css最佳实践文件在应用程序启动时。我想知道其他人如何为他们的应用做什么，以及最好的方式是做什么。

Answer 1

我相信公认的方法是样式表位于顶部，而javascript依赖位于底部，这似乎是您如何组织的。

除了您的文件中的WHERE请求这些文件，请记住，每个单独的脚本或链接标记是个人回呼服务器。来回17次旅行，不包括图片等，可能会对您的用户造成实际的影响。

您是否考虑过在您的项目中使用Ember-CLI？ （http://www.ember-cli.com）它使这样的东西 - 更容易。它将为您捆绑所有库和样式表，并为您节省大量时间。如果您使用样式表或JavaScript预处理器更是如此。

如果您不太喜欢使用Ember-CLI，那么会有各种实用程序和网站来压缩您的依赖关系。