Best way to use Laravel Mix file versioning?

Need Help
#1

Hi guys,

I noticed that the default October CMS theme now uses Laravel Mix which is great!
Is there a built-in way to use file versioning using the mix-manifest.json file?

Laravel comes with a mix() helper function, but this function is not recognized by Twig so it cannot be used to load assets by default.

I have found the following workaround to be effective:

In your Plugin.php file (or Provider.php if you want to use the app directory in October v3), simply register a Twig function that calls mix() and passes the path of the asset you want to load:

public function registerMarkupTags(): array
    {
        return [
            'functions' => [
                'mix' => fn() => mix(
                    func_get_arg(0),
                    sprintf('/themes/%s/assets', \Cms\Classes\Theme::getActiveTheme()->getDirName())
                ),
            ],
        ];
    }

Now, you will be able to load scripts and stylesheets with file versioning enabled like this:

<link rel="stylesheet" href="{{ mix('/dist/css/app.css') }}">

This workflow assumes that mix-manifest.json is located in your theme’s assets directory. You can do this by adding mix.setPublicPath('assets'); to your webpack.mix.js.

I’m pretty happy overall with this solution, but I was just wondering if there is a better way to do this?

2 Likes
#2

Hello and welcome @fj82!

Also you can just do this inside php section of any page / layout

==
public function onStart() {
    $this->addCss(mix('/dist/css/app.css'));
    $this->addJs(mix('/dist/js/app.js'));
}
==
3 Likes