Rollup&Drupal

Drupal 8

Пишем нативный js в Друпале используя Rollup.
Это не так уж и сложно, достаточно создать проект Rollup и в настройках указать, что наши глобальные переменные как Drupal или drupalSettings будут внешними.

Первым делом инициализируем новый проект package.json

// @file MyModule/package.json
{
"name": "MyModule",
"version": "1.0.0",
"main": "rollup.config.js",
"license": "MIT",
"scripts": {
"build": "rollup -c --environment NODE_ENV:prod",
"dev": "rollup -c -w"
},
"dependencies": {}
}

Создаем конфиг Rollup. rollup.config.js

// @file MyModule/rollup.config.js
export default [
{
input: 'assets/source/MyModule.js',
external: ['drupalCore', 'drupalSettingsCore'],
output: {
file: 'assets/js/MyModule.js',
format: 'iife',
globals: {
drupalCore: 'Drupal',
drupalSettingsCore: 'drupalSettings',
},
},
},
];

И последним шагом создаем наш исходный js файл

// @file MyModule/assets/source/MyModule.js
import Drupal from 'drupalCore';
import drupalSettings from 'drupalSettingsCore';

Drupal.behaviors.MyModule = {
attach: function (context, settings) {
context = context || document;
settings = settings || drupalSettings;
let count = (2/50)*52;
console.log(`Result: ${count}`)
}
};

И в итоге получится

// @file MyModule/assets/js/MyModule.js
(function (Drupal, drupalSettings) {
'use strict';

Drupal = Drupal && Drupal.hasOwnProperty('default') ? Drupal['default'] : Drupal;
drupalSettings = drupalSettings && drupalSettings.hasOwnProperty('default') ? drupalSettings['default'] : drupalSettings;

Drupal.behaviors.static = {
attach: function (context, settings) {
context = context || document;
settings = settings || drupalSettings;
let count = (2/50)*52;
console.log(`Result: ${count}`);
}
};

}(Drupal, drupalSettings));