Merge pull request #7 from reducejs/refactor

Refactor: even simpler api
reducejs · Mar 1, 2016 · 6878485 · 6878485
2 parents 3f5a583 + f7ce3ca
commit 6878485
Show file tree

Hide file tree

Showing 12 changed files with 262 additions and 303 deletions.
diff --git a/README.md b/README.md
@@ -13,43 +13,46 @@ Augment [`browserify`] with the following features:
   which make `b.bundle()` output a stream manipulatable by [`gulp`] plugins.
   It can be replaced with other plugins like [`factor-bundle`].
 
-## API
+## Example
+Check the [gulpfile.js](example/multiple-bundles/gulpfile.js)
 
 ```js
-const reduce = require('reduce-js')
-
-```
-
-### reduce.bundle(b, opts)
-Return a transform:
-* input: [`vinyl-fs#src`]
-* output: `b.bundle()`
-
-**b**
-
-[`browserify`] instance.
-
-**opts**
-
-Options passed to `reduce.bundler`.
-
-
-```javascript
 'use strict'
 
 const reduce = require('reduce-js')
+const gulp = require('gulp')
 const path = require('path')
-const run = require('callback-sequence').run
+const del = require('del')
 const browserify = require('browserify')
 
-run([clean, bundle]).then(() => { console.log('DONE') })
-
-function clean() {
-  let del = require('del')
+gulp.task('clean', function () {
   return del(path.join(__dirname, 'build'))
-}
+})
 
-function bundle() {
+gulp.task('build', ['clean'], function () {
+  let b = createBundler()
+  return gulp.src('page/**/index.js', { cwd: b._options.basedir, read: false })
+    .pipe(reduce.bundle(b, {
+      groups: 'page/**/index.js',
+      common: 'common.js',
+    }))
+    .pipe(gulp.dest('build'))
+})
+
+gulp.task('watch', ['clean'], function (cb) {
+  let b = createBundler()
+  b.on('bundle-stream', function (bundleStream) {
+    // `bundleStream` is the result of `b.bundle()`
+    bundleStream.pipe(gulp.dest('build'))
+  })
+  gulp.src('page/**/index.js', { cwd: b._options.basedir, read: false })
+    .pipe(reduce.watch(b, {
+      groups: 'page/**/index.js',
+      common: 'common.js',
+    }, { entryGlob: 'page/**/index.js' }))
+})
+
+function createBundler() {
   let basedir = path.join(__dirname, 'src')
   let b = browserify({
     basedir: basedir,
@@ -59,46 +62,48 @@ function bundle() {
   b.on('log', console.log.bind(console))
   b.on('error', console.log.bind(console))
 
-  return reduce.src('*.js', { cwd: basedir })
-    .pipe(reduce.bundle(b, {
-      groups: '**/page/**/index.js',
-      common: 'common.js',
-    }))
-    .pipe(reduce.dest('build'))
+  return b
 }
 
 ```
 
-Work with [`gulp`]:
+## API
+
+```javascript
+const reduce = require('reduce-js')
+
+```
+
+### reduce.bundle(b, opts)
+Return a transform:
+* input: [`vinyl-fs#src`]
+* output: `b.bundle()`
+
+**b**
+
+[`browserify`] instance.
+
+**opts**
+
+Options passed to `reduce.bundler`.
+
+
 ```javascript
 'use strict'
 
 const reduce = require('reduce-js')
-const gulp = require('gulp')
 const path = require('path')
-const del = require('del')
 const browserify = require('browserify')
 
-gulp.task('clean', function () {
-  return del(path.join(__dirname, 'build'))
-})
-
-gulp.task('build', ['clean'], function () {
-  let basedir = path.join(__dirname, 'src')
-  let b = browserify({
-    basedir: basedir,
-    paths: [path.join(basedir, 'web_modules')],
-  })
+const basedir = path.join(__dirname, 'src')
+const b = browserify({ basedir: basedir })
 
-  b.on('log', console.log.bind(console))
-  b.on('error', console.log.bind(console))
-  return gulp.src('page/**/index.js', { cwd: b._options.basedir, read: false })
-    .pipe(reduce.bundle(b, {
-      groups: '**/page/**/index.js',
-      common: 'common.js',
-    }))
-    .pipe(gulp.dest('build'))
-})
+reduce.src('*.js', { cwd: basedir })
+  .pipe(reduce.bundle(b, {
+    groups: '+(a|b).js',
+    common: 'common.js',
+  }))
+  .pipe(reduce.dest('build'))
 
 ```
 
@@ -120,92 +125,86 @@ Options passed to [`watchify2`].
 ```javascript
 'use strict'
 
-const reduce = require('../..')
+const reduce = require('reduce-js')
 const path = require('path')
-const run = require('callback-sequence').run
 const browserify = require('browserify')
 
-run([clean, bundle])
+const basedir = path.join(__dirname, 'src')
+const b = browserify({ basedir: basedir })
 
-function clean() {
-  let del = require('del')
-  return del(path.join(__dirname, 'build'))
-}
+b.on('bundle-stream', function (bundleStream) {
+  // `bundleStream` is the result of `b.bundle()`
+  bundleStream.pipe(reduce.dest('build'))
+})
+reduce.src('*.js', { cwd: basedir })
+  .pipe(reduce.watch(b, {
+    groups: '+(a|b|d).js',
+    common: 'common.js',
+  }, { entryGlob: '*.js' }))
 
-function bundle() {
-  let basedir = path.join(__dirname, 'src')
-  let b = browserify({
-    basedir: basedir,
-    paths: [path.join(basedir, 'web_modules')],
-  })
+```
 
-  b.on('log', console.log.bind(console))
-  b.on('error', console.log.bind(console))
+### reduce.src(patterns, opts)
+Same with [`vinyl-fs#src`], except that `opts.read` defaults to `false`.
 
-  return reduce.src('*.js', { cwd: basedir })
-    .pipe(reduce.watch(b, {
-      groups: '**/page/**/index.js',
-      common: 'common.js',
-    }, { entryGlob: 'page/**/index.js' }))
-    // Constructors are required rather than stream objects.
-    .pipe(reduce.dest, 'build')
-}
+### reduce.dest(outFolder, opts)
+Same with [`vinyl-fs#dest`].
 
-```
+### reduce.bundler(b, opts)
+The default plugin for packing modules.
 
-Work with [`gulp`]:
-```javascript
-'use strict'
+**opts**
 
+Default: `bundle.js`
+
+* `Function` or `Array`: `b.plugin(opts)` will be executed. Used to replace the default bundler [`common-bundle`].
+* `String`: all modules are packed into a single bundle, with `opts` the file path.
+* otherwise: `opts` is passed to [`common-bundle`] directly.
+
+```js
 const reduce = require('reduce-js')
-const gulp = require('gulp')
 const path = require('path')
-const del = require('del')
 const browserify = require('browserify')
 
-gulp.task('clean', function () {
-  return del(path.join(__dirname, 'build'))
+const b = browserify({
+  entries: ['a.js', 'b.js'],
+  basedir: '/path/to/src',
 })
+b.plugin(reduce.bundler, 'bundle.js')
+b.bundle().pipe(reduce.dest('build'))
 
-gulp.task('watch', ['clean'], function (cb) {
-  let basedir = path.join(__dirname, 'src')
-  let b = browserify({
-    basedir: basedir,
-    paths: [path.join(basedir, 'web_modules')],
-  })
+```
 
-  b.on('log', console.log.bind(console))
-  b.on('error', console.log.bind(console))
+### reduce.watcher(b, opts)
+The plugin for watching file changes, addition and deletion.
 
-  gulp.src('page/**/index.js', { cwd: b._options.basedir, read: false })
-    .pipe(reduce.watch(b, {
-      groups: '**/page/**/index.js',
-      common: 'common.js',
-    }, { entryGlob: 'page/**/index.js' }))
-    // Constructors are required rather than stream objects.
-    .pipe(gulp.dest, 'build')
+`opts` is passed to [`watchify2`] directly.
+
+```js
+const reduce = require('reduce-js')
+const path = require('path')
+const browserify = require('browserify')
+const b = browserify({
+  entries: ['a.css', 'b.css'],
+  basedir: '/path/to/src',
+})
+b.plugin(reduce.bundler, 'bundle.js')
+b.plugin(reduce.watcher, { entryGlob: '*.js' })
+b.on('bundle-stream', function (bundleStream) {
+  // bundleStream is the result of `b.bundle()`
+  bundleStream.pipe(reduce.dest('build'))
 })
+b.start()
 
 ```
-### reduce.src(patterns, opts)
-Same with [`vinyl-fs#src`], except that `opts.read` defaults to `false`.
 
-### reduce.dest(outFolder, opts)
-Same with [`vinyl-fs#dest`].
-
-### reduce.bundler(b, opts)
-The default plugin for packing modules.
-
-**opts**
-
-Default: `bundle.js`
+## Related
 
-* `Function` or `Array`: `b.plugin(opts)` will be executed.
-* `false`: no extra plugin is applied.
-* `String`: modules are packed into a single bundle, and `opts` is its file path.
-* otherwise: `opts` is passed to [`common-bundle`].
+* [`reduce-css`]
+* [`browserify`]
 
 
+[`reduce-css`]: https://github.com/reducejs/reduce-css
 [`browserify`]: https://www.npmjs.com/package/browserify
 [`factor-bundle`]: https://www.npmjs.com/package/factor-bundle
 [`common-bundle`]: https://www.npmjs.com/package/common-bundle

diff --git a/example/multiple-bundles/gulpfile.js b/example/multiple-bundles/gulpfile.js
@@ -14,20 +14,22 @@ gulp.task('build', ['clean'], function () {
   let b = createBundler()
   return gulp.src('page/**/index.js', { cwd: b._options.basedir, read: false })
     .pipe(reduce.bundle(b, {
-      groups: '**/page/**/index.js',
+      groups: 'page/**/index.js',
       common: 'common.js',
     }))
     .pipe(gulp.dest('build'))
 })
 
 gulp.task('watch', ['clean'], function (cb) {
   let b = createBundler()
+  b.on('bundle-stream', function (bundleStream) {
+    bundleStream.pipe(gulp.dest('build'))
+  })
   gulp.src('page/**/index.js', { cwd: b._options.basedir, read: false })
     .pipe(reduce.watch(b, {
-      groups: '**/page/**/index.js',
+      groups: 'page/**/index.js',
       common: 'common.js',
     }, { entryGlob: 'page/**/index.js' }))
-    .pipe(gulp.dest, 'build')
 })
 
 function createBundler() {

diff --git a/example/single-bundle/gulpfile.js b/example/single-bundle/gulpfile.js
@@ -13,15 +13,17 @@ gulp.task('clean', function () {
 gulp.task('build', ['clean'], function () {
   let b = createBundler()
   return gulp.src('page/**/index.js', { cwd: b._options.basedir, read: false })
-  .pipe(reduce.bundle(b))
+    .pipe(reduce.bundle(b, 'bundle.js'))
     .pipe(gulp.dest('build'))
 })
 
 gulp.task('watch', ['clean'], function (cb) {
   let b = createBundler()
+  b.on('bundle-stream', function (bundleStream) {
+    bundleStream.pipe(gulp.dest('build'))
+  })
   gulp.src('page/**/index.js', { cwd: b._options.basedir, read: false })
-    .pipe(reduce.watch(b, null, { entryGlob: 'page/**/index.js' }))
-    .pipe(gulp.dest, 'build')
+    .pipe(reduce.watch(b, 'bundle.js', { entryGlob: 'page/**/index.js' }))
 })
 
 function createBundler() {

diff --git a/example/without-gulp/src/b.js b/example/without-gulp/src/b.js
@@ -1,4 +1,3 @@
 require('./c');
 
 module.exports = 'b';
-
diff --git a/example/without-gulp/watch-without-gulp.js b/example/without-gulp/watch-without-gulp.js
@@ -2,30 +2,25 @@
 
 const reduce = require('../..')
 const path = require('path')
-const run = require('callback-sequence').run
 const browserify = require('browserify')
+const del = require('del')
 
-run([clean, bundle])
-
-function clean() {
-  let del = require('del')
-  return del(path.join(__dirname, 'build'))
-}
-
-function bundle() {
+del(path.join(__dirname, 'build')).then(function () {
   let basedir = path.join(__dirname, 'src')
   let b = browserify({ basedir: basedir })
 
   b.on('log', console.log.bind(console))
   b.on('error', console.log.bind(console))
 
  let bundleOpts = {
-    groups: '**/+(a|b|d).js',
+    groups: '+(a|b|d).js',
     common: 'common.js',
   }
 
+  b.on('bundle-stream', function (bundleStream) {
+    bundleStream.pipe(reduce.dest('build'))
+  })
   reduce.src('*.js', { cwd: basedir })
     .pipe(reduce.watch(b, bundleOpts, { entryGlob: '*.js' }))
-    .pipe(reduce.dest, 'build')
-}
+})