JQuery, media queries, сборка

Форум /

Здравствуйте, Уважаемые БЭМовцы! Безумно надоело копипастить от проекта к проекту одно и тоже, поэтому однозначно буду использовать данную технологию, и, уже начал пользоваться, но есть много непонятных моментов, некоторые из которых уже решил, но некоторые остались, которые очень сильно мешают использовать всю мощь данной технологии. Поэтому очень сильно надеюсь на Вашу помощь!

Сразу скажу, что очень плохо знаю чистый js, но на данный момент уже записался на курс по js в хорошую школу (не буду рекламировать название), но обучение не так быстро, а БЭМ уже хочется использовать, но пока без js.

Как использовать JQuery? Т.к. добавляя в js файл блока команды из jquery они не работают, хотя саму библиотеку на странице подключаю, и в *.bundles эти скрипты подключаются в конец файла index.min.js, но исполняться почему-то не хотят.
Как подключать и использовать другие библиотеки (например: magnific-popup, bxslider, font-awesome и д.р.)? Тоже не понятно, т.к. на страницу подключаю, и они там отображаются, но также как и с jquery работать не хотят.
Как делать адаптивные сайты в данной технологии, точнее как реализовывать структуру? Как я понял, идет разделение на платформы, и т.е. каждый медиа запрос разбивать в зависимости от устройства? Например:

desctop.blocks/
    menu/
        menu.css    //Тут прописываю стили для компьютера

tablet.blocks/
    menu/
        menu.css    //@media only screen and (max-width : 992px) и далее стили для планшета

phone.blocks/
    menu/
        menu.css    //@media only screen and (max-width : 480px) и далее стили для телефона

Правильно ли так делать? И если нет, то поправьте пожалуйста.

Как собрать весь проект воедино в отдельную папку, например dist? Чтобы были разные страницы (index.html, contacts.html), и один общий файл стилей, и общий файл скриптов. Т.е. всё как в простом проекте. Это для того, чтобы сверстанный проект можно было отдать back-end разработчику, который про bem ничего не знает, и хочет получить проект в таком виде.

Друзья, кто компетентен в этом помогите пожалуйста! Если есть возможность объяснить это всё по skype, то это будет вообще идеально. Я понимаю, что знания стоят денег, поэтому в случае компетентной помощи это вообще не вопрос) Спасибо!

8 years ago

tadatuta

Как использовать JQuery?

Нужно «попросить» jQuery у модульной системы:

modules.require('jquery', function($) {
    // тут пишем код, использующий jQuery
});

Как подключать и использовать другие библиотеки

См., например, https://ru.bem.info/forum/426/

Как делать адаптивные сайты в данной технологии, точнее как реализовывать структуру?

Можно, как в примере, разбить по платформам, где каждая платформа — уровень переопределения. Можно для каждого типа устройств создавать отдельную технологию:

blocks/
    b1/
        b1.common.css
        b1.desktop.css
        b1.touch.css

А можно просто писать все в одном файле.

Правильный ответ — как удобнее.

Как собрать весь проект воедино в отдельную папку, например dist?

Если воспользоваться сборкой на gulp, то просто подправить вызов gulp.dest() под свои нужды.

Чтобы оставлять комментарии, необходимо авторизоваться.