Mojo::Alien::webpack - Runs the external nodejs program webpack
use Mojo::Alien::webpack; my $webpack = Mojo::Alien::webpack->new; # Run once $webpack->build; # Build when webpack see files change $webpack->watch;
Mojo::Alien::webpack is a class for runnig the external nodejs program webpack.
$path = $webpack->assets_dir; $webpack = $webpack->assets_dir($webpack->config->dirname->child('assets'))
Location to source assetsa and partial webpack.config.js files.
$array_ref = $webpack->binary; $webpack = $webpack->binary('webpack');
The path to the webpack executable. Defaults to MOJO_WEBPACK_BINARY environment variable, or "webpack" inside "./node_modules". Fallback to just "webpack".
MOJO_WEBPACK_BINARY
$path = $webpack->config; $webpack = $webpack->config(path->to_abs->child('webpack.config.js'));
Holds an /absolute path to webpack.config.js.
$hash_ref = $webpack->dependencies;
A hash where the keys can match the items in "include" and the values are lists of packages to install. Keys that does /not match items in "include" will be ignored. This attribute will be used by "init".
These dependencies are predefined:
core | webpack webpack-cli css | css-loader mini-css-extract-plugin css-minimizer-webpack-plugin eslint | eslint-webpack-plugin js | @babel/core @babel/preset-env @babel/plugin-transform-runtime babel-loader terser-webpack-plugin sass | css-loader mini-css-extract-plugin css-minimizer-webpack-plugin sass sass-loader vue | vue vue-loader vue-template-compiler
$array_ref = $webpack->include; $webpack = $webpack->include([qw(js css)]);
"include" can be used to install dependencies and load other webpack config files. The config files included must exist in the "webpack.config.d" sub directory inside "assets_dir". Here is an example of which files that will be included if they exists:
# Including "js" and "css" will look for the files below $webpack->include[qw(js css)]); # - assets/webpack.config.d/package-babel-loader.js # - assets/webpack.config.d/package-terser-webpack-plugin.js # - assets/webpack.config.d/package-css-loader.js # - assets/webpack.config.d/package-css-minimizer-webpack-plugin.js # - assets/webpack.config.d/js.js # - assets/webpack.config.d/css.js
The "include" feature is currently EXPERIMENTAL.
$str = $webpack->mode; $webpack = $webpack->mode('development');
Should be either "development" or "production". Will be used as "NODE_ENV" environment variable when calling "build" or "watch".
$npm = $webpack->npm;
A Mojo::Alien::npm object used by "init".
$path = $webpack->out_dir; $webpack = $webpack->out_dir(path('dist')->to_abs);
Location to write output assets to.
$hash_ref = $webpack->asset_map;
Parses the filenames in "out_dir" and returns a hash ref with information about the generated assets. Example return value:
{ 'relative/output.development.js' => { # Key is relative path to out_dir() ext => 'css', # File extension mode => 'development', # or "production" mtime => 1616976114, # File modification epoch timestamp name => 'relative/output.js', # Name of asset, without checksum or mode path => '/path/to/entry-name.development.js', # Absolute path to asset }, }
Note that this method is currently EXPERIMENTAL.
$webpack->build;
Will build the assets or croaks on errors. Automatically calls "init".
$webpack->exec;
This method will replace the current process, instead of starting webpack inside a fork. This method is called by "watch" inside a fork.
$webpack = $webpack->init;
Will install "webpack" and "webpack-cli" and create a default "config". Does nothing if this is already done.
This method is automatically called by "build" and "watch".
$int = $webpack->pid;
Returns the PID of the webpack process started by "start".
$webpack->stop;
Will stop the process started by "watch". Does nothing if "watch" has not been called.
$webpack->watch;
Forks a new process that runs "webpack watch". This means that any changes will generate new assets. This is much more efficient than calling "build" over and over again. Automatically calls "init".
Mojolicious::Plugin::Webpack and Mojo::Alien::rollup.
To install Mojolicious::Plugin::Webpack, copy and paste the appropriate command in to your terminal.
cpanm
cpanm Mojolicious::Plugin::Webpack
CPAN shell
perl -MCPAN -e shell install Mojolicious::Plugin::Webpack
For more information on module installation, please visit the detailed CPAN module installation guide.