什么是loader
Node静态资源加载器。该模块通过两个步骤配合完成,代码部分根据环境生成标签。上线时,需要调用minify方法进行静态资源的合并和压缩。
npm install loader
render:
res.render('index', {
Loader: require('loader')
});
或在app.js中:
app.locals({
Loader: require('loader')
});
模板文件:
<%- Loader("/public/javascripts/aa.js", "/public/stylesheets/style.css")
.js("/public/javascripts/a.js")
.js("/public/javascripts/b.js")
.css("/public/stylesheets/style.css")
.done(assetsMap, prefix, combo) %>
环境判别
环境判别由done方法的第三个参数决定,如果传入combo值,将决定选用线下版本(false)还是线上版本(true)。如果不传入第三个参数,将由环境变量决定。
// 设置window下node环境变量
// 生产环境
set NODE_ENV="production"
// 开发环境
set NODE_ENV="development"
线上输出
在应用根目录下使用命令:
// loader views_dir base_dir
loader ./views ./
会在根目录下生成assets.json文件:
{"/public/javascripts/aa.js":"/public/javascripts/aa.2e4c08f9.min.js","/public/stylesheets/style.css":"/public/stylesheets/style.b6b3ce7e.min.css"}
在app.js中:
app.locals({
Loader: Loader,
assets: require('./assets.json'),
mini_assets: true
});
done方法参数为:
.done(assets, '', mini_assets)
html为:
<script src="/public/javascripts/aa.2e4c08f9.min.js"></script>
<link rel="stylesheet" href="/public/stylesheets/style.b6b3ce7e.min.css" media="all">