Node loader

什么是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">