ES-модули и сборка через @bitrix/cli
Сборка фронтенда в Битриксе стандартизирована через утилиту @bitrix/cli (Rollup + Babel) и файл конфигурации bundle.config.js. Сборщик автоматически определяет внешние зависимости ядра по директивам import и добавляет их в массив rel файла config.php, исключая дублирование библиотек в клиентском коде.
Прогресс хранится в этом браузере. Войдите, чтобы сохранить его в аккаунте.
Что нужно понимать
-
1
@bitrix/cli и bitrix build
-
2
ES-модули и импорт расширений
-
3
Vue и React внутри расширений
-
4
Версионирование собранной статики
Материалы
Официальная документация
-
Vue.js Новая дока
Материалы BXMax
Проверь себя
Пул-реквест меняет src/app.js, а на проде после деплоя всё по-старому. Почему?
В браузер уходит dist/app.bundle.js, а не src. Либо dist не пересобрали и не закоммитили, либо деплой не запускает bitrix build. Выберите одно правило и держитесь его.
Чем импорт из main.popup отличается от импорта своего файла из src?
Свой файл попадает в бандл. Чужое расширение в бандл не попадает, сборщик дописывает его в rel файла config.php, и ядро подключит его отдельным файлом перед вашим.
Зачем в bundle.config.js параметр namespace, если код и так работает через import?
Для кода вне модулей: инлайнового script в шаблоне компонента или старого расширения. Без namespace экспорты не доступны как BX.Local.Cart и до них не дотянуться.
Заказчик хочет виджет на Vue в карточке товара. Что выбрать: свой Vue из npm или ui.vue3?
ui.vue3: одна копия Vue на страницу, интеграция с Loc и событиями, без window.Vue. Свой Vue из npm оправдан только если нужны однофайловые .vue или SSR — этого BitrixVue не даёт.
Не сходится?
Спросите ассистента BXMax: он знает документацию и материалы сайта по этой теме.
Знаете материал лучше?
Предложите ссылку: после проверки она появится в этом разделе.
Войти, чтобы предложить