css require - Githubissues

entcor commented 11 years ago

Добрый день ! Вроде уже было, но как то опять проявилось: https://docs.google.com/file/d/0B-ZKZRQ2AMTZSjVYYjFHVHlmV0E/edit?usp=sharing

css, собранный в проект заранее, не хочет применяться ! если указать на внешний css - то все работает

спасибо

entcor commented 11 years ago

Дополнение: у меня есть список модулей: 1.js, 2.js, 1.css и т.п. это попадает в один require.async(....) но при этом css документа не применяются Как сделать чтобы не надо было отдельно делать require для js и require.css

azproduction commented 11 years ago

{
    "name": "release build",
    "root": "../",
    "output": "release.js",
    "modules": {
        "main": "main.js"
    },
    "main": "main",
    "css": true,
    "file_protocol": true,
    "optimize": true
}

test.css включать в сборку не нужно - сборщик воспримит его как текстовый файл.

require.css("test.css", function (status) {
    console.log(status);
});

Я собирал используя lmd@1.10.6 попробуй обновить и пересобрать. У меня красный фон не пропал.

Как сделать чтобы не надо было отдельно делать require для js и require.css

Если ты используешь jQuery, то ты можешь использовать его промисы для синхронизации ресурсов. И превратить вызовы require.xyz в генераторы промисов.

{
    "promise": "$.Deferred"
}

"$.Deferred" означает - при старте плагина используй require('$').Deferred в качестве генератора промисов.

var css = require.css,
    js = require.js;

$.when(js('pewpew.js'), css('ololo.css')).then(function (js, css) {
    // both are loaded
});

Пример https://github.com/azproduction/lmd/tree/master/examples/plugins/promise

Если jQuery или любой библиотеки поставляющей промисы нет совсем, то, к сожалению, никаких маханизмов упрощающих запросы разных ресурсов пока нет.

entcor commented 11 years ago

test.css включать в сборку не нужно - сборщик воспримит его как текстовый файл

т.е. я вобще не смогу затолкать css в сборку !?

entcor commented 11 years ago

Вопрос не в тему.... у меня есть проект.... он собран на твоем LMD. он по конфигурации грузит дополнительные модули. Это CSS, внешнием библиотеки, собственные модули, которые можно оформить как LMD модули. Набор этих модулей может меняться (зависит от конфигурации)

Это работает, но как собрано мне не нравится они представляют собой отдельные файлы уже не собрание LMD сборщиком (это не нравится) Можно ли собрать отдельные LMD подмодули, которые можно отдельно включать в ранее собранный проект

azproduction commented 11 years ago

т.е. я вобще не смогу затолкать css в сборку !?

Задача LMD - управление модулями JS. То, что оно умеет грузить CSS это скорее исключение. Как говорится "Ты не должен хотеть включать css в сборку" на крайняк можешь это сделать, но написать модуль, который будет "оживлять" CSS из JS-строки.

Можно ли собрать отдельные LMD подмодули, которые можно отдельно включать в ранее собранный проект

Подмодули (обычные модули, но собранные в 1-м файле) собирать можно, используя bundles. Пример https://github.com/azproduction/lmd/tree/master/examples/features/bundles

Эта часть приложения оттестирована и работает у меня в продакшене, но в ней есть небольшой недостаток - сборщик врет насчет "модуль не используется" для модулей, входящих в Саб-сборку. Сейчас я правлю этот момент.

У бандлов есть особенность. Они грузятся как статический JSONP и после каждой сборки имеют новый "ID" - те имя функции, которая будет вызвана _random_id({...bundles...}). Зафиксировать это имя можно, но не стоит :) Это сделано из-за соображений сохранения версионности.

azproduction commented 11 years ago

Конфиг бандла имеют абсолютно идентичный формат с lmd.json, но соответственно не имеет "загрузочной части". Может так же иметь main, который будет выполнен при загрузке бандла.

entcor commented 11 years ago

Сейчас бандлы попробую !

Да еще примечание: попался на том, что в require может попасться пустой список - в этом случае callback не отрабатывает. Не оч удобно, т.к. перечень модулей для загрузки может создаваться динамически.

entcor commented 11 years ago

А как бандл загружать динамически (не описывая его в основной конфигурации) ?

azproduction commented 11 years ago

Как правило динамичеки загружаются какие-то ресурсы. А количество статических файлов, которые может использовать приложение как правило лимитировано. Поэтому я советую распилить эти модули на бандлы.

У LMD есть способ загрузить похожие файлы или вообще все файлы, используя что-то похожее на mod_rewrite и rewrite rule - это glob-выражения. Те ты определяешь какие файлы нужно загрузить и определяешь шаблон по которым они будут представлены в проекте.

Например, у тебя есть, 20+ шаблонов:

{
    "<%= file %>Template": "templates/*.js" // index.js -> "indexTemplate"
}

Вот так всех их можно включить в сборку. Пример https://github.com/azproduction/lmd/tree/master/examples/features/glob

А как бандл загружать динамически (не описывая его в основной конфигурации) ?

LMD собирает только статику тк полагает, что набор скриптов ограничен и их можно так или иначе распределить. LMD спроектирован так, чтобы иметь минимальные знания о том, что где лежит и как будет работать. Фактически он не знает где окончательно будет лежать результат сборки и бандлы. Может ты их на CDN унесешь или переименуешь или еще что. Поэтому неизбежно добавление пути до бандла в сборку и описывание бандла. Да это немного многословно, но позволяет LMD не завязываться на файловую систему, которой нет в браузере.

azproduction commented 11 years ago

На данный момент я на 100% отказался от использования require.js require.async и прочих в сторону бандлов. Тут достаточно думать о приложении как о куче сгруппированных модулей по назначению. Бандлы соответственно - это группы модулей и шаблонов. Например, если нужно лениво показать "Опции приложения" пользователю - загружаешь бандл и бандл даже может сам себя стартануть по аналоги с "main" и показать опции.

entcor commented 11 years ago

И все же я не очень понимаю: почему если я пишу: require.css и указываю конкретный внешний css файл - он применяется как стиль а если его ложу внутрь проекта, то нет !!!! (не логично)

azproduction commented 11 years ago

Это может показаться не логичным, однако же логика тут есть :) LMD собирает JavaScript и соответственно может понять только те штуки, которые есть в JS - строки, json и код. О CSS оно не знает.

Загрузка css это уже сторонняя штука и мешать его с JS не совсем верно. В свою очередь require.css сделан для удобства, согласен, что он может запутать. Если это так необходимо. Включи css как JavaScript строки, а потом инициализируй CSS явно из данной строки.

entcor commented 11 years ago

Ну хорошо ! .... спасибо

azproduction / lmd

css require #122