Package Exports
- cache-loader
- cache-loader/package.json
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (cache-loader) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
cache-loader
The cache-loader
allow to Caches the result of following loaders on disk (default) or in the database.
Getting Started
To begin, you'll need to install cache-loader
:
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.
Options
Name | Type | Default | Description |
---|---|---|---|
cacheContext |
{String} |
undefined |
Allows you to override the default cache context in order to generate the cache relatively to a path. By default it will use absolute paths |
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 |
Examples
Basic
webpack.config.js
module.exports = {
module: {
rules: [
{
test: /\.js$/,
use: ['cache-loader', 'babel-loader'],
include: path.resolve('src'),
},
],
},
};
Database Integration
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'),
},
],
},
};
Contributing
Please take a moment to read our contributing guidelines if you haven't yet done so.