NAME
Mojolicious::Plugin::Webpack::Builder - Assets builder
SYNOPSIS
See "SYNOPSIS" in Mojolicious::Plugin::Webpack.
DESCRIPTION
Mojolicious::Plugin::Webpack::Builder is a Mojolicious::Plugin that will run webpack. This plugin is automatically registered by Mojolicious::Plugin::Webpack, so you do not have to register it yourself.
Note that it is not a typo in examples below where Webpack
is the first argument to "plugin" in Mojolicious.
ENVIRONMENT VARIABLES
All the environment variables below are experimental and subject to change.
MOJO_NPM_BINARY
Default value is "npm", but you can set it to another value, such as "pnpm", if you like https://pnpm.js.org/ better.
MOJO_WEBPACK_BINARY
Used to instruct which "webpack" binary to run. Will defaul to either "node_modules/.bin/webpack" or "node_modules/.bin/rollup", based on "MOJO_WEBPACK_CONFIG".
MOJO_WEBPACK_CONFIG
Defaults to webpack.config.js
, but can be set to another config file, such as rollup.config.js
.
MOJO_WEBPACK_REINSTALL
Set this variable if you already have a node_modules/
directory, but you want npm install
to be run again.
MOJO_WEBPACK_VERBOSE
Set this variable to pass on --progress
, --profile
and --verbose
to "webpack".
PLUGIN SHIM
Mojolicious::Plugin::Webpack::Builder will install a shim of Mojolicious::Plugin::Webpack if there is a writable "Plugin" directory in your distribution. Example:
# Generate a full Mojolicious application
$ mojo generate app MyApp
$ cd my_app
# Create a Plugin directory
$ mkdir -p lib/MyApp/Plugin
# Edit your application and enable it to load the shim
$ $EDITOR lib/MyApp.pm
When editing MyApp.pm
, add load the Mojolicious::Plugin::Webpack plugin with the "shim" key set:
sub startup {
my $self = shift;
# Make sure you can load plugins from your application namespaces
unshift @{$self->plugins->namespaces}, "MyApp::Plugin";
# Load the plugin with "shim" set
$self->plugin(Webpack => {process => ["js"], shim => 1});
}
Save the file and start your application with mojo webpack
:
$ mojo webpack ./script/my_app
This will then generate lib/MyApp/Plugin/Webpack.pm
which will be enough to run in production, which again means that your application does not depend on Mojolicious::Plugin::Webpack at all.
ATTRIBUTES
dependencies
$hash_ref = $self->dependencies;
Holds a mapping between what this plugin can "process" and which node modules it depends on. Example:
$app->plugin("Webpack" => {
dependencies => {
css => [qw(css-loader mini-css-extract-plugin optimize-css-assets-webpack-plugin)],
js => [qw(@babel/core @babel/preset-env babel-loader terser-webpack-plugin)],
sass => [qw(node-sass sass-loader)],
}
});
These dependencies will automatically be installed when the key is present in "process".
process
$array_ref = $self->process;
A list of assets to process. Currently "css", "js", "sass" and "vue" is supported. Example:
$app->plugin("Webpack" => {process => [qw(js sass vue)]});
source_maps
$bool = $self->source_maps;
Set this to "0" if you do not want source maps generated. Example:
$app->plugin("Webpack" => {source_maps => 0});
Default: true (enabled).
METHODS
assets_dir
$path = $self->assets_dir;
Proxy method for "assets_dir" in Mojolicious::Plugin::Webpack.
node_env
$path = $self->node_env;
Proxy method for "node_env" in Mojolicious::Plugin::Webpack.
out_dir
$path = $self->out_dir;
Proxy method for "out_dir" in Mojolicious::Plugin::Webpack.
register
$self->register($app, \%config);
$app->plugin("Webpack::Builder", \%config);
Used to register this plugin into your Mojolicious app. Normally called automatically by "register" in Mojolicious::Plugin::Webpack, where %config
is passed through without any modifications.