Caches the result of following loaders on disk (default) or in the database
npm install --save-dev cache-loader
Add this loader in front of other (expensive) loaders to cache the result on disk.
webpack.config.js
module.exports = { module: { rules: [ { test: /\.ext$/, use: [ 'cache-loader', ...loaders ], include: path.resolve('src') } ] } }
⚠️ Note that there is an overhead for saving the reading and saving the cache file, so only use this loader to cache expensive loaders.
Name | Type | Default | Description |
---|---|---|---|
cacheKey |
{Function(options, request) -> {String}} |
undefined |
Allows you to override default cache key generator |
cacheDirectory |
{String} |
path.resolve('.cache-loader') |
Provide a cache directory where cache items should be stored (used for default read/write implementation) |
cacheIdentifier |
{String} |
cache-loader:{version} {process.env.NODE_ENV} |
Provide an invalidation identifier which is used to generate the hashes. You can use it for extra dependencies of loaders (used for default read/write implementation) |
write |
{Function(cacheKey, data, callback) -> {void}} |
undefined |
Allows you to override default write cache data to file (e.g. Redis, memcached) |
read |
{Function(cacheKey, callback) -> {void}} |
undefined |
Allows you to override default read cache data from file |
webpack.config.js
module.exports = { module: { rules: [ { test: /\.js$/, use: [ 'cache-loader', 'babel-loader' ], include: path.resolve('src') } ] } }
##
webpack.config.js
// Or different database client - memcached, mongodb, ... const redis = require('redis'); const crypto = require('crypto'); // ... // connect to client // ... const BUILD_CACHE_TIMEOUT = 24 * 3600; // 1 day function digest(str) { return crypto.createHash('md5').update(str).digest('hex'); } // Generate own cache key function cacheKey(options, request) { return `build:cache:${digest(request)}`; } // Read data from database and parse them function read(key, callback) { client.get(key, (err, result) => { if (err) { return callback(err); } if (!result) { return callback(new Error(`Key ${key} not found`)); } try { let data = JSON.parse(result); callback(null, data); } catch (e) { callback(e); } }); } // Write data to database under cacheKey function write(key, data, callback) { client.set(key, JSON.stringify(data), 'EX', BUILD_CACHE_TIMEOUT, callback); } module.exports = { module: { rules: [ { test: /\.js$/, use: [ { loader: 'cache-loader', options: { cacheKey, read, write, } }, 'babel-loader' ], include: path.resolve('src') } ] } }
Tobias Koppers |
Juho Vepsäläinen |
Joshua Wiens |
Michael Ciniawsky |
Alexander Krasnoyarov |
© JS Foundation and other contributors
Licensed under the Creative Commons Attribution License 4.0.
https://webpack.js.org/loaders/cache-loader