Durandal是一个轻量级的JavaScript框架，其目标是单页面应用（SPAs）的开发变得简单而优雅。它支持MVC、MVP和MVVM等模式，因此不论你采用哪种类型的前端架构，Durandal都能胜任。
Durandal以RequireJS为基础，加上一个轻量级的惯例层，带来了令人惊叹的生产效率，并且帮助你维持稳健的编码实践。配上开箱即用的富界面组件、模态对话框、事件/消息、组件、过渡效果、导航等等，使你可以轻松开发出任何你能想象的应用。
尽管Durandal才发布大约一年时间，但其社区正以飞快的速度成长。
因此，我们推出了一个Kickstarter来帮助我们在2014年完成一些神奇的事情，希望你能关注。但现在，我将向你展示如何开发一个简单的Durandal程序。
要开始使用Durandal，可以有多种方式，这取决于你的平台。因为Durandal是一个纯JavaScript库，独立于任何服务端平台，我们尝试用多种方式来打包，以满足各类Web开发人员。在本教程中，我们将直接使用HTML Starter Kit。你可以在官方网站上直接下载。
下载完HTML Starter Kit后，解压缩，你就可以直接在Firefox各版本中打开index.html页面，运行其示例程序了。或者你也可以将其部署到Web服务器中，浏览其index页面。
本栏目更多精彩内容：http://www.bianceng.cn/webkf/tools/
Starter Kit演示了一个基本的导航架构，包括导航、页面历史、数据绑定、模态对话框等等。当然，我们不只是看看而已，我们要从头开始写一个小程序。首先打开app文件夹，删除里面的所有内容，然后删除index.html。这样我们就有了一个空项目，并且预配置了所有必须的scripts和css。
*注：IE, Chrome和Safari可能无法从文件系统中直接打开这类文件。如果你仍希望使用这些浏览器，可以将其部署到你喜欢的Web服务器中。
Index.html 我们开始编写index.html文件，内容如下：
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="lib/bootstrap/css/bootstrap.css" />
<link rel="stylesheet" href="lib/font-awesome/css/font-awesome.css" />
<link rel="stylesheet" href="lib/durandal/css/durandal.css" />
<link rel="stylesheet" href="css/starterkit.css" />
</head>
<body>
<center id="applicationHost"></center>
<script src="lib/require/require.js" data-main="app/main"></script>
</body>
</html>
我们看到，文件中只有一些css样式文件，一个id为applicationHost的简单的center， ，一个script标签。我们加上了Bootstrap和FontAwesome，使界面看起来美观一些，但它们并不是Durandal所必须的。我们要关注的关键代码是script标签。
Durandal采用RequireJS作为其核心构件之一，鼓励模块化的编程方式。在Durandal应用中，所有的JS代码都写在模块中。上文index.html中的script标签就是用于加载RequireJS来完成框架的模块策略。当模块加载器完成初始化后，它通过data-main属性的值来启动应用。就像C语言中的main函数一样，data-main属性指向的是主模块，是整个应用的入口。让我们进行下一步，创建这个模块。首先创建一个名为main.js的文件，把它放到app文件夹下。其代码如下：
main.js
requirejs.config({
paths: {
'text': '../lib/require/text',
'durandal':'../lib/durandal/js',
'plugins' : '../lib/durandal/js/plugins',
'transitions' : '../lib/durandal/js/transitions',
'knockout': '../lib/knockout/knockout-2.3.0',
'jquery': '../lib/jquery/jquery-1.9.1'
}
});
define(function (require) {
var system = require('durandal/system'),
app = require('durandal/app');
system.debug(true);
app.title = 'Durandal Starter Kit';
app.configurePlugins({
router:true,
dialog: true
});
app.start().then(function() {
app.setRoot('shell');
});
});
以上是小编为您精心准备的的内容，在的博客、问答、公众号、人物、课程等栏目也有的相关内容，欢迎继续使用右上角搜索按钮进行搜索app
， 文件
， 应用
， requirejs
， knockout
， 模块
， index
， knockout js
， app js
， 一个
， FontAwesome
， jquery1.9.1
， JQuery快速入门
RequireJS入门
durandal、durandal 中文手册、durandaljs 中文网、durandaljs、durandal 教程，以便于您获取更多的相关知识。