Skip to content

Instantly share code, notes, and snippets.

@jiewmeng
Created March 21, 2016 01:00
Show Gist options
  • Save jiewmeng/ed97b7ac9f1dd70f8850 to your computer and use it in GitHub Desktop.
Save jiewmeng/ed97b7ac9f1dd70f8850 to your computer and use it in GitHub Desktop.
NPM Script to run nodemon, browser-sync and watchify
'use strict';
/**
* Starts `nodemon` and `browser-sync`
*/
const path = require('path');
const fs = require('fs');
const nodemon = require('nodemon');
const browserSync = require('browser-sync').create();
const browserify = require('browserify');
const watchify = require('watchify');
const babelify = require('babelify');
const sass = require('node-sass');
const watch = require('node-watch');
const SRCDIR = path.normalize(`${__dirname}/../src`);
const BUILDDIR = path.normalize(`${__dirname}/../build`);
let browserSyncInitialized = false;
nodemon({
script: `${SRCDIR}/app.js`,
watch: `${SRCDIR}`,
ext: 'js,jsx,jade'
});
let b = browserify({
cache: {},
packageCache: {},
plugin: [watchify],
entries: [
`${SRCDIR}/public/react/index.jsx`
]
})
.transform('babelify', {
presets: ['es2015', 'react']
});
let bundle = function() {
b.bundle()
.on('error', function(err) {
console.error(`BROWSERIFY ERROR: ${err.message}`);
console.error(err.stack);
this.emit('end');
})
.pipe(fs.createWriteStream(`${BUILDDIR}/js/index.js`))
};
b.on('update', bundle);
b.on('log', console.log);
bundle();
watch(`${SRCDIR}/public/scss`, function() {
const OUTFILE = `${BUILDDIR}/css/app.css`;
sass.render({
file: `${SRCDIR}/public/scss/app.scss`,
outFile: OUTFILE
}, function(err, result) {
if (err) {
console.error(`SASS ERROR: [Line ${err.line}] ${err.message}`);
return;
}
console.log('SASS RENDERED: ', result.stats);
fs.writeFile(OUTFILE, result.css, 'utf8', function(err) {
if (err) console.error('SASS ERROR: Failed to write file');
console.log(`SASS Wrote to ${OUTFILE}`);
});
});
});
nodemon
.on('start', function() {
console.log('Nodemon started');
if (!browserSyncInitialized) {
browserSync.init({
proxy: 'http://localhost:8000',
port: '3000',
notify: true,
files: [
`${BUILDDIR}/**/*`
]
});
browserSyncInitialized = true;
} else {
setTimeout(browserSync.reload, 500);
}
})
.on('quit', function() {
console.log('Nodemon stopped');
process.exit(0);
})
.on('restart', function(files) {
console.log('Nodemon restarted');
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment