mojolicious plugin webpack
1.0.0
Mojolicious::插件::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 模块，因此只会在开发时安装。
开发时，Webpack 可执行文件将在 Mojo::Server::Morbo 旁边自动启动。 Webpack 将使用适当的开关启动，以监视源文件并在更改时重新编译。
rollup.js 是 Webpack 的替代品。两者或多或少都完成了相同的事情，但方式不同。
为了能够使用 rollup，您必须使用不同的引擎加载此插件：
$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")该帮助器最基本的用法是使用 Mojolicious::Plugin::TagHelpers 中的“javascript”或 Mojolicious::Plugin::TagHelpers 中的“样式表”（如果传入有效的资产名称）创建 HTML 标签。
另一方面，如果没有传入参数，助手将返回插件实例，允许您调用任何“方法”或访问“属性”。
$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
},
...
}请注意，更改此哈希可能会更改“asset”和“url_for”的行为方式！
$webpack->register($app, %config);
$app->plugin("Webpack", %config);用于将此插件注册到您的 Mojolicious 应用程序中。
加载此插件时传递的%config可以具有以下任何属性：
资产路径
可用于指定将构建的资源输出到的备用静态目录。
默认值：“/资产”。
缓存控制
用于设置构建资源的响应“Cache-Control”标头。
默认值：开发时为“no-cache”，生产时为“max-age=86400”。
引擎
必须是有效的引擎类名称。示例：
$app->plugin("Webpack", {engine => 'Mojo::Alien::rollup'});
$app->plugin("Webpack", {engine => 'Mojo::Alien::webpack'});默认值：Mojo::Alien::webpack。
帮手
将添加到您的应用程序中的助手的名称。
默认值：“资产”。
过程
用于指定 Mojo::Alien::webpack 中的“include”或 Mojo::Alien::rollup 中的“include”。
默认值： ['js'] 。
$url = $webpack->url_for($c, $asset_name);
返回给定资产的 Mojo::URL。
简·亨宁·索尔森
版权所有 (C) Jan Henning Thorsen
该程序是免费软件，您可以根据 Artistic License 2.0 版的条款重新分发和/或修改它。
Mojo::Alien::rollup，Mojo::Alien::webpack。
