brick-asset
v1.1.1
Published
Site CSS/JS generator for Brick.JS
Downloads
7
Readme
Asset Generator for Brick.JS
This article explains how to use brick-asset
as a command line tool
(and as a NPM package).
For information about CSS Processors called by brick-asset
, see:
- brick-js/brick-less: LESS pre-processor for brick.js.
- brick-sass? All kind of contributions are wellcomed.
Command Line Interface
Install
npm install -g brick-asset
Usage
Generate "./public/site.js"
and "./public/site.css"
:
brick-asset all
Only generate ./public/site.css
:
brick-asset css
Specify Brick.JS Module Root (default to ./bricks/
):
brick-asset all --root ./my-brick-modules
Specify output location:
# ./static/site.js, ./static/site.css
brick-asset all --output ./static
# ./static/js/main.js
brick-asset js --output ./static/js/main.js
For more details, see:
brick-asset --help
Programmatically
Usage
var asset = require('brick-asset');
var promise = asset.src('./bricks');
promise
.then(function(){
asset.js().then(src => console.log(src));
asset.css().then(src => console.log(src));
});
.src()
.src()
load bricks in the specified directory.
Returns a promise which will be resolved as brick Array.
.js()
.js()
generates the JS for all the bricks with a CommonJS loader.
Returns a promise which will be resolved as a String of JavaScript source.
.css()
.css()
generates the modularized CSS for all the bricks.
Returns a promise which will be resolved as a String of CSS source.
Gulp Task
Here's a Gulp file generating public/site.css
and public/site.js
:
var asset = require('brick-asset');
var file = require('gulp-file');
gulp.task('js', function(cb) {
asset.src('./bricks')
.then(x => asset.js())
.then(css => file('site.js', css, {src: true})
.pipe(gulp.dest('public'))
.on('finish', cb));
});
gulp.task('css', function(cb) {
asset.src('./bricks')
.then(x => asset.css())
.then(css => file('site.css', css, {src: true})
.pipe(gulp.dest('public'))
.on('finish', cb));
});