0

首先，我是 EmberJS 和 RequireJS 的初学者，所以请记住，我可能会对某些概念有些迷失。

这是问题所在。我正在尝试使用 RequireJS 作为依赖管理器来开始使用 EmberJS。我已经找到了一些入门工具包，但它们都使用旧的 EmberJS 路由器，因此它永远无法使用更新的包。（它使用旧语法来定义路由）

我当前的应用程序层次结构是 

/
-- /css
-- /img
-- /js
---- /app
------ /controllers
------ /models
------ /views
------ app.js
------ router.js
---- /libs (All libraries are inside)
---- config.js
---- main.js
-- /templates (Html templates)
-- index.html

我的 index.html 包含 

<!DOCTYPE html>
<!--[if lt IE 7 ]> <html lang="fr" class="ie6"> <![endif]-->
<!--[if IE 7 ]> <html lang="fr" class="ie7"> <![endif]-->
<!--[if IE 8 ]> <html lang="fr" class="ie8"> <![endif]-->
<!--[if IE 9 ]> <html lang="fr" class="ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html lang="fr"> <!--<![endif]-->
    <head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

    <title>Title</title>
    <meta name="description" content="Description">
    <meta name="author" content="Author">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <link rel="shortcut icon" href="img/favicon.ico">
    <link rel="apple-touch-icon" href="img/apple-touch-icon.png">
    <link rel="stylesheet" href="css/style.css">

    <!--[if lt IE 9]>
    <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->

    <script data-main="js/main" src="js/libs/require-2.1.11.min.js"></script>
    </head>
    <body id="app">
    </body>
</html>

一旦我们解决了问题，我将很乐意分享结果。如果您需要有关我的代码的任何其他信息，请询问。

此致。

编辑： 我的 config.js 包含 

define({
    app_name: "App_name",
    shim: {
       'ember': {
           deps: ['handlebars', 'jquery'],
           exports: 'Ember'
       },
       'ember_data': {
           deps: ['ember'],
           exports: 'DS'
       }
    },
    paths: {
       'App': 'app/main',
       'models': 'app/models',
       'views': 'app/views',
       'controllers': 'app/controllers',
       'templates': '../templates',
       /*libs*/
       'jquery': 'libs/jquery-2.1.0.min',
       'handlebars': 'libs/handlebars-1.3.0.min',
       'ember': 'libs/ember-1.4.0.min',
       'ember_data': 'libs/ember-data-1.0.0-beta7.min',
       /*requirejs-plugins*/
       'text': 'libs/requirejs-plugins/text',
       'tpl': 'libs/requirejs-plugins/hbs',
       'domReady': 'libs/requirejs-plugins/domReady',
       /*hbs dependancies*/
       'hbs/underscore': 'libs/hbs/underscore',
       'hbs/i18nprecompile': 'libs/hbs/i18nprecompile',
       'hbs/json2': 'libs/hbs/json2'
    },
    /*hbs plugin options*/
       hbs: {
       helpers: true,
       i18n: false,
       templateExtension: 'html',
       partialsUrl: ''
    }
});

我不应该说它失败了，更多的是它没有使用正确的格式来声明路由。 

define(["ember"], function(Ember) {
    var Router = Ember.Router.extend({
        root: Ember.Route.extend({
            index: Ember.Route.extend({
            route: '/'
            }),
            otherRoute: Ember.Route.extend({
                route: '/other'
            })
        })
    });

    return Router;
});
4

1 回答 1

0

虽然标准解决方案是使用诸如 ember-app-kit 或 ember-cli 之类的东西，它们使用自定义解析器来消除对像 App 这样的全局命名空间的需要，但可以让 Ember 与 RequireJS 一起使用而无需使用自定义解析器. 您只需要传递全局名称空间。

首先，创建一个 app.js：

define([
    "ember"
], function(Ember) {
    var App = Ember.Application.create();
    App.deferReadiness();

    return App;
});

然后像这样定义你的路由器：

define([
    "ember",
    "app"
], function(Ember, App) {

    App.Router.map(function () {
        this.route('someRoute');
        // ...
    });

    return App.Router;
});

你的文件是这样的：

define([
    "ember",
    "app"
], function(Ember, App) {

    App.SomeRoute = Ember.Route.extend({
        // ...
    });

    return App.SomeRoute;
});

然后在你的 main.js 中：

(function(root){
    require(["config"], function(config){
        requirejs.config(config);
        require([
            "app",
            "models/someModel",
            "models/store",
            "adapters/someAdapter",
            "controllers/someController",
            "views/someView",
            "router",
            "routes/someRoute",
            // ...
        ], function(App) {
            App.advanceReadiness();
        });
    });
})(this);
于 2014-05-15T02:26:17.190 回答