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.

SEE ALSO

Mojolicious::Plugin::Webpack.