Ember.js и RequireJS - PullRequest
       29

Ember.js и RequireJS

34 голосов
/ 08 января 2012

У кого-нибудь был большой успех с RequireJS и Ember.js?Видя, что Ember нравится, когда его структура присваивается глобальному объекту, я обнаружил, что он действительно может столкнуться с Requirejs.Будет ли что-то вроде LAB.js работать лучше для Ember?

Ответы [ 5 ]

31 голосов
/ 10 января 2012

РЕДАКТИРОВАТЬ (2012-01-30): я выдвинул более полный пример в репо на bitbucket.

Я успешно использовал RequireJS для загрузки Ember.js, а также аддон datetime ( github ). Пространство имен Ember само остается глобальным, но все данные моего приложения, включая мой экземпляр Ember.Application, хранятся в модулях через RequireJS. Я также загружаю шаблоны руля, используя текст! плагин.

У меня еще не было никаких проблем, но это не полное приложение, скорее подтверждение концепции. Вот как я заставил это работать. Я могу загрузить свое приложение напрямую с Safari без необходимости сервера. Вам все равно понадобится сервер для загрузки его с Chrome, который не позволяет JavaScript загружать файлы из файловой системы.

1) Поскольку Ember.js использует BPM / Spade, я не смог использовать клон репо. Вместо этого я оборачиваю скомпилированную версию в модуль:

Библиотека / ember.js

define(['jquery',
        'plugins/order!lib/ember-0.9.3.js',
        'plugins/order!lib/ember-datetime.js'],
         function() {
             return Ember;
});

Обратите внимание, что это само по себе не скрывает Ember от глобальной области видимости. Но я настраиваю все так, чтобы, если в будущем я смог это скрыть, все остальные модули, которые зависят от этого модуля, все равно работали как есть.

2) Модули могут относиться к Ember следующим образом:

приложение / core.js

define(['lib/ember'], function(Em) {
    MyApp = Em.Application.create({
        VERSION: "0.0.1"
    });
    return MyApp;
});

Здесь «Эм» можно было бы назвать как-нибудь еще; он не ссылается непосредственно на глобальную переменную, но происходит из модуля, определенного в lib / ember.js .

3) Чтобы попасть в Ember, руль должен быть зарегистрирован:

приложение / шаблоны / My-template.handlebars

MyApp v{{MyApp.VERSION}}.

приложение / просмотров / My-view.js

define(['lib/ember',
        'plugins/text!app/templates/my-template.handlebars'],
        function(Em, myTemplateSource) {

            Em.TEMPLATES["my-template"] = Em.Handlebars.compile(myTemplateSource);

            var myView = Em.View.create({
                templateName: "my-template";
            });

            return myView;
});

4) Я использую require-jquery.js (jQuery и RequireJS связаны друг с другом).

8 голосов
/ 10 сентября 2012

Есть лучший способ включить файл руля, который может иметь несколько шаблонных блоков. Который может быть скомпилирован и доступен в одном.

Например: у вас есть следующий файл шаблона Handlebars:

.. / шаблоны / sample.handlebars

<div><!-- just a filler html tag. Wont show up in your page -->
    <script type="text/x-handlebars" data-template-name="template1">
        Some Html or Template Content ...
    </script>
    <script type="text/x-handlebars" data-template-name="template2">
        Some Html or Template Content ...
    </script>
    <script type="text/x-handlebars" data-template-name="template3">
        Some Html or Template Content ...
    </script>
</div>

.. / просмотров / sampleView.js

define([
    'jquery',
    'lib/ember',
    'plugins/text!../templates/sample.handlebars'],
    function($, Em, myTemplateSource) {

        // Bootstrap method accepts a context element under which all handlebars
        // template blocks are defined. The filler <div> in this case.
        // Compiles and assigns to the EM.TEMPLATES hash correctly. 
        Em.Handlebars.bootstrap($(myTemplateSource));

        var myView = Em.View.create({
            templateName: "template1";
        });

        return myView;
});
3 голосов
/ 04 сентября 2014

Ember CLI поддерживает синтаксис модуля ES6, который переносится в AMD. Похоже, что сообщество поддерживает Ember CLI как предпочтительный способ использования Ember.

http://www.ember -cli.com

3 голосов
/ 10 декабря 2012

Я только что загрузил на github стартовый набор для EmberJS + RequireJS, вы можете проверить его https://github.com/fernandogmar/Emberjs-RequireJS

Любые хорошие предложения будут высоко оценены. Веселись!

0 голосов
/ 19 августа 2013

Mimosa имеет несколько хороших примеров проектов, использующих Ember и Require.js.Вот один из них для оформления заказа: https://github.com/dbashford/mimosa-ember-emblem-templates. Инструкции по его запуску находятся в README.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...