bubleup v0.5.2
tl;dr
$ bubleup
# is the same as
$ bubleup src/index.js --out-dir dist
# watch mode
$ bubleup --watch
Why is this useful?
I always repeat the same configurations for bundling my front-end libraries. With Bubleup you can simply run bubleup
to generate commonjs
-format code and or append --format umd
to generate umd
-format code, and it's fast! You can even pass --compress
to generate compressed file and sourcemap.
Install
$ npm install -g bubleup
Usage
The buble guide: https://buble.surge.sh/guide
You can specific options in command-line:
$ bubleup src/index.js -d output
For full CLI usage please run bubleup -h
, It's hard to describe some nested options in command line, so you can also configure them in package.js, eg:
{
"bubleup": {
"entry": "./path/to/my-entry.js"
}
}
name
The filename of bundled files, the default value is package name in package.json
. If no package.json was found, fallback to index
.
$ bubleup --name redux --format umd --format cjs
# generate ./dist/redux.js ./dist/redux.common.js
format
Specific the bundle format, it could be a string like 'umd'
or multiple targets ['umd', 'cjs']
, it's useful if you want to support multiple standards. Default value is ['cjs']
.
You should specfic a moduleName
if you target umd
, otherwise fallback to name
.
{
"bubleup": {
"format": ["cjs", "umd"]
}
}
compress
Enable this option to generate an extra compressed file for the UMD bundle, and sourcemap.
{
"bubleup": {
"format": "umd",
"compress": true
}
}
// generates: [name].js [name].min.js [name].min.js.map
async
Transform async/await
to generator function, defaults to true
.
alias
This is some feature which is similar to Webpack's alias
, eg:
{
"bubleup": {
"alias": {
"controllers": "./src/controllers"
}
}
}
paths
This helps you import some file from the CDN (as using AMD), or set an alias to an external file, see more details in Rollup's WIKI.
transforms
Apply custom transform rules to buble
options:
{
"bubleup": {
"transforms": {
"dangerousForOf": false
}
}
}
target
Compile targets, eg:
{
"bubleup": {
"target": {"chrome": 48, "firefox": 44, "node": 4}
}
}
jsx
Buble supports JSX, and you can specfic a custom JSX pragma:
{
"bubleup": {
"jsx": "createElement"
}
}
map
Generate soucemaps for cjs
and umd
builds, note that --compress
will always generate sourcemaps for .min.js
file:
{
"bubleup": {
"map": true
}
}
watch
Run Rollup in watch mode, which means you will have faster incremental builds.
API
import bubleup from 'bubleup'
bubleup(options).catch(err => {
if (err.snippet) {
// display the actual error snippet
console.error(err.snippet)
}
console.error(err.stack)
})
License
MIT © EGOIST