es6-bowerful v0.3.2
es6-bowerful
Tool for installing bower dependencies that won't include entire repos. Although Bower works great as a light-weight tool to quickly install browser dependencies, it currently does not provide much functionality for installing specific "built" components for the client.
Bower installer provides an easy way for the main files to be installed or moved to one or more locations. Simply add to
your bower.json
an install
key and path
attribute:
{
"name": "test",
"version": "0.1",
"dependencies": {
"bootstrap": "latest"
},
"path": {
"regex/path": "{name}/{file}"
}
}
Install bower-installer by executing
npm install es6-bowerful
Install dependencies from bower.json
by executing
bower install
Examples gulp:
import 'colors';
import gulp from 'gulp';
import map from 'map-stream';
import bowerful from 'es6-bowerful';
const { dependencies, path, sources } = require('./bower.json');
gulp.task('build-bower', (done) => {
const counter = {};
bowerful({ install: Object.keys(dependencies), sources }, (src) => {
console.log('\n=== Files ===');
src
.pipe(bowerful.dest('./test', path))
.pipe(
map((file, cb) => {
const resultPath = file.destPath;
if (!counter[resultPath]) {
console.log(`----${resultPath.blue}`);
counter[resultPath] = 1;
} else counter[resultPath] += 1;
console.log(`[${counter[resultPath].toString().magenta}] |- ${file.relative}`);
cb(null, file);
}),
)
.on('end', () => {
console.log('\n=== Results ===');
Object.keys(counter).forEach((key) => {
console.log(`[${key.blue}] ${counter[key].magenta} files`);
});
done();
});
});
});
gulp.task('build-bower', (done) => {
const counter = {};
bowerful('./bower_components', (src) => {
src
.pipe(bowerful.dest('./public/libs'))
.on('end', () => {
done();
});
});
});
Config
Add config in bower.json
file.
Default
{
"name": "test",
"version": "0.1",
"dependencies": {
"bootstrap": "latest"
}
}
Result will get all file in 'dist'
folder, if 'dist'
folder not exist will get main files from bower.json
in dependency folder :
build/
css/
*.css
js/
*.js
font/
*
Use RegExp config dest path
{name}
: dependency name
{
"name": "test",
"version": "0.1",
"dependencies": {
"bootstrap": "latest"
},
"path": {
"/css/*": "css/{name}"
}
}
Dest folder css will move to css/{name}
with '{name}'
is 'bootstrap'
:
build/
css/
bootstrap/
css/*.css
js/
*.js
font/
*
{file}
: file.base in pipe
{
"name": "test",
"version": "0.1",
"dependencies": {
"bootstrap": "latest"
},
"path": {
"/css/*": "css/{name}/{file}"
}
}
Dest folder css will move to css/{name}
with '{name}'
is 'bootstrap'
and '{file}'
is bootstrap.css
, v.v...:
build/
css/
bootstrap/
*.css
js/
*.js
font/
*
Use vinyl-fs config src path
{
"name": "test",
"version": "0.1",
"dependencies": {
"bootstrap": "latest"
},
"path": {
"/css/*": "css/{name}/{file}"
},
"sources": {
"bootstrap": ["dist/css/**", "dist/fonts/**", "dist/js/**"],
}
}
build/
css/
bootstrap/
*.css
*.js
*