mojolicious plugin webpack
1.0.0
Mojolicious::Plugin::Webpack - Mojolicious ♥ Webpack
Создайте файл «./assets/index.js» относительно каталога вашего приложения со следующим содержимым:
console.log('Cool beans!');Вашему приложению Mojolicious необходимо загрузить плагин Mojolicious::Plugin::Webpack и указать ему, какие ресурсы он должен обрабатывать:
$app->plugin(Webpack => {process => [qw(js css)]});См. «Регистрация» для получения дополнительных параметров конфигурации.
Чтобы включить сгенерированные ресурсы в ваш шаблон, вы можете использовать помощник «актив»:
%= asset "cool_beans.css" %= asset "cool_beans.js"
Вы можете запустить приложение с помощью daemon , hypnotoad или любого другого сервера Mojolicious, но если вы хотите быстрой разработки, вам следует использовать mojo webpack , который является альтернативой morbo :
$ mojo webpack -h $ mojo webpack ./script/myapp.pl
Однако если вы хотите использовать другой демон и принудительно запустить webpack , вам необходимо установить для переменной среды MOJO_WEBPACK_BUILD значение «1». Пример:
MOJO_WEBPACK_BUILD=1 ./script/myapp.pl daemon
Если вы хотите убедиться, что создали все ресурсы, вы можете создать тестовый файл, например «build-assets.t»:
use Test::More;
use Test::Mojo;
# Run with TEST_BUILD_ASSETS=1 prove -vl t/build-assets.t
plan skip_all => "TEST_BUILD_ASSETS=1" unless $ENV{TEST_BUILD_ASSETS};
# Load the app and make a test object
$ENV{MOJO_MODE} = 'production';
$ENV{MOJO_WEBPACK_BUILD} = 1;
use FindBin;
require "$FindBin::Bin/../script/myapp.pl";
my $t = Test::Mojo->new;
# Find all the tags and make sure they can be loaded
$t->get_ok("/")->status_is(200);
$t->element_count_is('script[src], link[href][rel=stylesheet]', 2);
$t->tx->res->dom->find("script[src], link[href][rel=stylesheet]")->each(sub {
$t->get_ok($_->{href} || $_->{src})->status_is(200);
});
done_testing;Mojolicious::Plugin::Webpack — это плагин Mojolicious, упрощающий работу с https://webpack.js.org/ или https://rollupjs.org/. Этот плагин будет...
Создайте минимальный package.json и файл конфигурации Webpack или Rollup. Сделать это вручную возможно, но выяснение всех деталей может занять довольно много времени, если вы еще не знакомы с Webpack.
Загрузите точку входа «./assets/index.js», которая является отправной точкой вашего клиентского приложения. Входной файл может загружать JavaScript, CSS, SASS и т. д. при условии, что загружен соответствующий плагин обработки.
Может быть сложно точно определить, какие плагины использовать с Webpack. По этой причине в Mojolicious::Plugin::Webpack есть несколько предопределенных правил, по которым следует получать и устанавливать зависимости Nodejs. Однако ни один из модулей nodejs не требуется в рабочей среде, поэтому он будет установлен только во время разработки.
Во время разработки исполняемый файл веб-пакета будет автоматически запускаться рядом с Mojo::Server::Morbo. Webpack будет запущен с соответствующими параметрами для просмотра исходных файлов и повторной компиляции при изменении.
rollup.js — альтернатива Webpack. Оба достигают более или менее одного и того же, но разными способами.
Чтобы иметь возможность использовать накопительный пакет, вам необходимо загрузить этот плагин с другим движком:
$app->plugin(Webpack => {engine => 'Mojo::Alien::rollup', process => [qw(js css)]});Mojolicious::Plugin::Webpack в настоящее время является ЭКСПЕРИМЕНТАЛЬНЫМ.
# Call a method or access an attribute in this class
my $path = $app->asset->engine->out_dir;
# Call a method, but from inside a mojo template
%= asset->url_for($c, "cool_beans.css")
# Generate a HTML tag
my $bytestream = $c->asset("cool_beans.js", @args);
# Generate a HTML tag, but from inside a mojo template
%= asset "cool_beans.css", media => "print"
%= asset(url_for => "cool_beans.css")Самое простое использование этого помощника — создание HTML-тега с использованием «javascript» в Mojolicious::Plugin::TagHelpers или «таблицы стилей» в Mojolicious::Plugin::TagHelpers, если передано допустимое имя ресурса.
С другой стороны, помощник вернет экземпляр плагина, если не переданы аргументы, что позволит вам вызвать любой из «МЕТОДОВ» или получить доступ к «АТРИБУТАМ».
$app->before_webpack_start(sub { my $webpack = shift; ... });Генерируется прямо перед тем, как плагин начинает создавать или загружать сгенерированные ресурсы. Полезно, если вы хотите изменить любой из атрибутов «движка» по умолчанию.
$engine = $webpack->engine;
Возвращает объект Mojo::Alien::webpack или Mojo::Alien::rollup.
$hash_ref = $webpack->asset_map;
Считывает все сгенерированные файлы в «asset_path» и возвращает хэш-ссылку, например:
{
"relative/output.js" => { # Key is a friendly name, withouc checksum
ext => 'css', # File extension
helper => 'javascript', # Mojolicious helper used to render the asset
rel_name => "relative/output.xyz.js", # Relative filename with checksum
},
...
}Обратите внимание, что изменение этого хеша может изменить поведение «актива» и «url_for»!
$webpack->register($app, %config);
$app->plugin("Webpack", %config);Используется для регистрации этого плагина в вашем приложении Mojolicious.
%config передаваемый при загрузке этого плагина, может иметь любой из этих атрибутов:
путь_актива
Может использоваться для указания альтернативного статического каталога для вывода собранных ресурсов.
По умолчанию: «/актив».
кэш_контроль
Используется для установки заголовка ответа «Cache-Control» для построенных ресурсов.
По умолчанию: «без кэша» при разработке и «max-age=86400» при производстве.
двигатель
Должно быть допустимое имя класса механизма. Примеры:
$app->plugin("Webpack", {engine => 'Mojo::Alien::rollup'});
$app->plugin("Webpack", {engine => 'Mojo::Alien::webpack'});По умолчанию: Mojo::Alien::webpack.
помощник
Имя помощника, который будет добавлен в ваше приложение.
По умолчанию: «актив».
процесс
Используется для указания «включения» в Mojo::Alien::webpack или «включения» в Mojo::Alien::rollup.
По умолчанию: ['js'] .
$url = $webpack->url_for($c, $asset_name);
Возвращает Mojo::URL для данного актива.
Ян Хеннинг Торсен
Авторское право (C) Ян Хеннинг Торсен
Эта программа является бесплатным программным обеспечением, вы можете распространять ее и/или изменять в соответствии с условиями Художественной лицензии версии 2.0.
Mojo::Alien::rollup, Mojo::Alien::webpack.
