Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Laravel Mix - Is Chaining Required to Ensure Execution Order?

TLDR;

Do you have to chain Laravel Mix methods to maintain the execution order? Are any methods async that would prevent one from using the following non-chaining pattern, mix.scripts(); mix.js(); mix.sass();?

The few tests I've run suggest I do not need to chain.

An Example

Due to how our Laravel app is setup, we need to have more that one Laravel Mix setup. Instead of copy-n-pasting a webpack.mix.js file and modifying a few lines here and there in each file, we're looking at creating a config object that is passed to a singular webpack.mix.js file. In this file, we would check if various things have been configured, and if so, run the appropriate Mix method. Below is a pseudo-code example.

if ( config.js ) {
  mix.js( config.js.src, config.js.dist );
}

if ( config.sass ) {
  mix.sass( config.sass.src, config.sass.dist );
}

if ( config.concat ) {

  if ( config.concat.styles ) {

    // Could be more than one set of files that need to be combined, so array.
    config.concat.styles.map( ( files ) => {
      mix.styles( files.src, files.dist );
    }
  }

  if ( config.concat.scripts ) {

    // Could be more than one set of files that need to be combined, so array.
    config.concat.scripts.map( ( files ) => {
      mix.scripts( files.src, files.dist );
    }
  }

}

Currently, our code is more like most examples you see on the web.

mix
  .options()
  .webpackConfig()
  .styles()
  .styles()
  .scripts()
  .js()
  .sass();
like image 669
hungerstar Avatar asked Apr 01 '20 15:04

hungerstar


1 Answers

laravel-mix abstracts configuration of webpack and dynamically generates the webpack config.

The organization of its API implementation is done using Builder pattern with a fluent or chainable interface. This makes it such that to produce a particular configuration only steps that are necessary to be performed have to be called.

You need to ensure that code in your webpack.mix.js module can be properly imported.

You need to be careful about the ordering of custom tasks such as copy, copyDirectory, combine, version. In v5.0.0, custom tasks are run without any bearing on their asynchronous nature. However there is coming changes to see to it that they are run sequentially.

Other API methods can be called in any order.

like image 84
Oluwafemi Sule Avatar answered Nov 15 '22 12:11

Oluwafemi Sule