How to become an author
Search
Profile
Pull to refresh

Comments 18

То то еще будет! У нас тут один сотрудник пилит искусственный интеллект ;)
This comment wasn’t rated yet 0
Для сборки js-очек? Да, это будет похлеще. Вообще соль в том что если у вас есть необходимость собирать сложный фронтэнд. то можно смело выкидывать assetic и заменять на нормальные системы сборки. Ассетика хватает только на что-то простое. В целом же бесполезная штука. Есть правда еще альтернативы, типа gasettic и ему подобные, но я пока не баловался.
This comment wasn’t rated yet 0
Возможно Вы в чем-то правы, есть более продвинутые системы сборки и выбор определенного варианта обычно зависит от конкретного случая. В статье описан один из таких вариантов сборки и он вполне, на мой взгляд, имеет право на существование.
В статье, главным образом, рассматривается не assetic, как таковой, а интеграция requirejs и r.js с symfony2.
This comment wasn’t rated yet 0
Честно говоря, я поддерживаю идею Fesor с тем, что сложный фронт должен отделяться от бэка. В конечном счёте, гораздо проще заточить бэк предоставления API к SPA-like архитектуре на фронте. Конечно, можно пользоваться и вашей схемой, но я не вижу в этом выигрыша.
This comment wasn’t rated yet 0
Я понимаю, но вы бы статью тогда сдобрили какими-нибудь кукбуками, как это все удобнее поддерживать потом… Ибо так это просто чуть расширеное ридми бандла. Я использовал его как-то раз года полтора назад, но мне показалось это не столь удобно.
This comment wasn’t rated yet 0
Статья и не претендует на всеобъемлющий туториал — просто информация к размышлению.
This comment wasn’t rated yet 0
И еще — использовались ли всякие bower (Да, есть для symfony и с bower интеграция), покрывался ли js код тестами и т.д. Как в этом случае вы бы организовывали проект?
This comment wasn’t rated yet 0
Bower мы не использовали — не было необходимости.
This comment wasn’t rated yet 0
Тестирование однозначно необходимо, хотя это и не совсем относится к теме статьи, добавить тестовое окружение к проекту не состовляет большого труда.
This comment wasn’t rated yet 0
Сборка у вас завязана на php уже, а как вы тесты будете запускать к примеру?
This comment wasn’t rated yet 0
Конечно Вы правы, есть некоторые особенности у этого процесса, и это, скорее тема для следующей статьи. Постараюсь это осветить в ближайшем будущем.
This comment wasn’t rated yet 0
Честно говоря, не пользовался Require.js, потому простите мне мой скептицизм. Я вполне доволен assetic, в связке с yuicompressor

привожу конфиг
assetic:
    debug:          %kernel.debug%
    use_controller: false
    bundles:        [FMElfinderBundle,CMSBundle,FOSCommentBundle]
    filters:
        compass: 
            bin: /usr/local/bin/compass
            apply_to: "\.s[ac]ss$"
        sass:
            bin: /usr/local/bin/sass
        scss: ~
        cssrewrite: ~
        uglifycss: ~
        uglifyjs2: ~
        yui_css:
            jar: %kernel.root_dir%/../vendor/packagist/yuicompressor-bin/bin/yuicompressor.jar
            apply_to: "\.css$"
        yui_js:
            jar: %kernel.root_dir%/../vendor/packagist/yuicompressor-bin/bin/yuicompressor.jar
            apply_to: "\.js$"
и
шаблон
        {% stylesheets
		"@CMSBundle/Resources/assets/css/*"
		"@BraincraftedBootstrapBundle/Resources/sass/form.scss"
		"css/compiled/*"
	%}
		<link rel="stylesheet" href="{{ asset_url }}" />
	{% endstylesheets %}
        {% javascripts
		'@CMSBundle/Resources/public/js/*'
		'@CMSBundle/Resources/public/original_js/*'
	%}
		<script type="text/javascript" src="{{ asset_url }}"></script>
	{% endjavascripts %}

Результат тот же, а промежуточных действий — меньше (установить yuicompressor, и добавить пару строк в конфиг). Наверное, я что-то упускаю, не могли бы вы привести какие-нибудь конкретные аргументы в пользу вашего предложения?
Total votes 1: ↑1 and ↓0 +1
RequireJS — это не компилятор и не минификатор. Это удобная штука для разруливания зависимостей в JS (что-то типа use и DI). Оптимизатор r.js всего лишь позволяет собирать всё в один файл с учётом зависимостей и минифицировать этот файл.

Имхо, вместо всяких ассетиков проще на девелопменте использовать неминифицированный код, а на продакшн (стейджинг и т.п.) деплоить чем-то вроде Grunt. Я, например, использую Grunt с тремя модулями — grunt-contrib-less, grunt-contrib-watch и grunt-contrib-requirejs. Задача local (она же является default-задачей) состоит из grunt-contrib-watch, подключается неминифицированная версию JS-фреймворка. Задача deploy состоит из grunt-contrib-less и grunt-contrib-requirejs, подключается минифицированный склеенный файл с JS-фреймворком. В идеале хорошо иметь отдельные склеенные файлы для каждой страницы сайта (контроллеры с их зависимостями).

В итоге у меня для деплоя используется Capistrano (с модулем Capifony — набором задач для деплоя проекта на Symfony 2), который на завершающих шагах (перед перенаправлением симлинка на новый релиз) вызывает Grunt для компиляции JS и LESS.
This comment wasn’t rated yet 0
Есть 2 вопроса по вашей конфигурации:

1. При такой конфигурации (используя filter="?requirejs") в получившемся минифицированном файле у меня в prod режиме падает ошибка: ReferenceError: jQuery is not defined
Зависимость от jquery везде указана, вот конфиг:
конфиг
hearsay_require_js:
    require_js_src: //cdnjs.cloudflare.com/ajax/libs/require.js/2.1.14/require.min.js
    initialize_template: HearsayRequireJSBundle::initialize.html.twig
    base_url: js
    base_dir: %kernel.root_dir%/scripts
    optimizer:
        path: %kernel.root_dir%/scripts/r.js
        hide_unoptimized_assets: false
    paths:
        # RequireJS plugins
        text: %kernel.root_dir%/scripts/requirejs/plugins/text

        # Application scripts
        app: @AppBundle/Resources/public/js/app
        user: @AppBundle/Resources/public/js
        platform: @AppBundle/Resources/public/js

        # Other libs and plugins
        underscore: %kernel.root_dir%/scripts/underscore
        chosen: %kernel.root_dir%/scripts/jquery/plugins/chosen/chosen.jquery.min

        # Externals
        jquery:
            location: //ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min
            external: true
        bootstrap:
            location: //maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min
            external: true
    options:
        locale: %locale%
        enforceDefine: true
        i18n:
            locale: %locale%
    shim:
        bootstrap:
            deps: [jquery]
            exports: jQuery
        underscore:
            exports: _
        chosen:
            deps: [jquery]
            exports: 'jQuery.fn.chosen'



2. Не менее важный вопрос: а как вы подключаете в шаблонах файлы, которые нужны только на этой странице? Конкретно код интересует.
Я попробовал подключить через 
{% block javascripts %}
<script>
        require(['user/login/helper'], function (LoginHelper) {
            LoginHelper.init();
        });
    </script>
{% endblock%}


но при этом они уже не минифицируются, а загружаются отдельным http запросом.

This comment wasn’t rated yet 0
Первая проблема частична решается путём переноса jquery в локальный файл. Остается такая проблема
Error: No define call for /js/0d5e2b3.js для файла requirejs.min.js
По ссылке requirejs.org/docs/errors.html#nodefine ни одна причина не подходит на мой взгляд. При этом dev режим работает отлично
This comment wasn’t rated yet 0
Only those users with full accounts are able to leave comments. Log in, please.

Your account

Sections

Information

Services

Support Return to old version
© 2006–2023, Habr