Make File Hash

Convert the default Laravel Mix querystring hashing to filename hashing.
latest v2.1.0 - released
ben-rogerson
10 downloads last week
ISC license
6 versions
hashing
hash
file
filehash

Laravel Mix make file hash

By default, the hashing system in Laravel Mix will append a querystring to the filename to invalidate the cache.

Example from mix-manifest.json:

{
  "/dist/main.js": "/dist/main.js?id=1e70e7c11a9185f57e64"
}

The problem is that this way of hashing may not work with some caching systems.

Instead, "Laravel Mix make file hash" will move the hash into the filename of the hashed files. So your mix-manifest.json will look something like this:

{
  "/dist/main.js": "/dist/main.1e70e7c11a9185f57e64.js"
}

Under the hood

To accomplish the re-hashing, this script will:

  1. Read the mix-manifest.json generated by Laravel Mix.
  2. Remove stale hashed files.
  3. Rename the files found in the manifest to include the hash within the filename.
  4. Update mix-manifest.json with the new filenames.
  5. Return the contents of the new manifest for further usage (if required).

Turn on debug to activate noisy feedback: { debug: true }

Installation

Install package from npmjs.com:

npm i -D laravel-mix-make-file-hash
# or
yarn add laravel-mix-make-file-hash -D

Normal usage

if (mix.inProduction()) {
  mix.version();
  mix.then(() => {
    const convertToFileHash = require("laravel-mix-make-file-hash");
    convertToFileHash({
      publicPath: "web",
      manifestFilePath: "web/mix-manifest.json"
    });
  });
}

Promise usage

convertToFileHash returns a Promise containing the new mix-manifest.json contents. This means you can perform another task after the convertToFileHash has finished the re-hashing.

if (mix.inProduction()) {
  mix.version();
  mix.then(async () => {
    const convertToFileHash = require("laravel-mix-make-file-hash");
    const fileHashedManifest = await convertToFileHash({
      publicPath: "web",
      manifestFilePath: "web/mix-manifest.json"
    });
    // Do something here...
  });
}

Options

Name Type Default Description
publicPath * string undefined The path to your public folder (eg: "web")
manifestFilePath * string undefined The filePath to your mix-manifest.json
(eg: "web/mix-manifest.json")
blacklist string/array undefined A glob pattern of files to ignore re-hashing
keepBlacklistedEntries boolean false Whether to keep blacklisted entries in the manifest
delOptions object { force: false } Options to provide to del - See options
debug boolean false Debug exactly what's happening (or meant to happen) during runtime

* = Required

Full config example

if (mix.inProduction()) {
  mix.version();
  mix.then(async () => {
        const convertToFileHash = require("laravel-mix-make-file-hash");
        convertToFileHash({
            publicPath: "web",
            manifestFilePath: "web/mix-manifest.json",
            blacklist: ["html", "main.js"],
            keepBlacklistedEntries: true,
            delOptions: { force: false },
            debug: false
        });
  })

Links

This script was created for the Agency Webpack Mix Config.