Static asset manager that allows you to declare multiple asset folders that will be searched when resolving static assets in your app. This library also provides the ability to precompile all of the static assets into their production form (e.g., minified content with hashed filenames). The precompile step generates a manifest file that will be used in production to resolve requested assets. It also generates a clientManifest that can be in the browser to dynamically load static assets (e.g., people using the Inject dependency management library - https://github.com/linkedin/inject)
First, install it in your project's directory:
npm install asset-manager
Then add this line to your app's configuration:
var assetManager = require('asset-manager')
Finally, initialize the manager with the paths it should search for static assets:
assetManager.start({
paths: ["assets",
"../global/assets",
"vendor"],
inProd: (process.env.NODE_ENV === 'production')
}, callback);
asset-manager
provides three global functions named img
, js
, and css
. Use them in your views to resolve
static assets into the markup need to resolve these assets in your page. For instance, in an [EJS template]:
<%- css('normalize') %>
<%- js('jquery') %>
<%- img('icon') %>
If you want to have your app serve the static assets as well (a likely case at dev time), you can use the provided Express middle ware to do this:
app.use(assetManager.expressMiddleware);
If you want to have your app serve the static assets in production as well, you can use the provided static Express middle ware to do this (the final parameter is whether or not the assets are gzip encoded):
app.use(assetManager.staticAssetMiddleware(express.static(__dirname + '/builtAssets', { maxAge: 31536000000 }), true));
You can precompile your assets into their production form as follows (CDN_BASE_URL should be set to whatever url you want prepended to your static asset paths):
assetManager.precompile({
paths: ["assets",
"../global/assets",
"vendor")],
servePath: CDN_BASE_URL,
gzip: true
}, callback);
If you like, you can pass any of these options to the start
or precompile
functions:
paths
(required): An array of paths that should be used to find static assets.inProd
(defaults tofalse
): Indicates whether the application is running in production mode or not.servePath
(defaults to ''): The path you want to append to all asset urls. Useful for pointing at an external CDN location.builtAssets
(defaults to 'builtAssets'): The folder you want precompiled assets to be placed in.context
(defaults to global): The object you want to hang the 'css', 'js', and 'img' functions on for resolving static assets.gzip
(defaults to false): Whether or not to gzip the contents of 'css' and 'js' files.scanDir
(defaults to ''): Include a base path you want asset-manager to scan for modules that containasset-manifest.json
files indicating the module contains static assets that should be available for use.