Skip to content

Instantly share code, notes, and snippets.

@marshall007
Forked from michaelcpuckett/simplest-express-setup-ever.js
Created October 18, 2012 15:53
Show Gist options
  • Save marshall007/3912724 to your computer and use it in GitHub Desktop.
Save marshall007/3912724 to your computer and use it in GitHub Desktop.
Use any folder on localhost:3000 (for development)
{
"watch":
{ "extensions": ["html", "htm", "js", "css", "less", "json"]
, "exclude": ["node_modules/", ".git/"] }
, "chrome":
{ "debugging_port": 9222
, "app_path": "/Applications/Google\\ Chrome.app" }
}
/**
* Module dependencies.
*/
var express = require('express')
, http = require('http')
, fs = require('fs')
, request = require('request').defaults({ json: true })
, _ = require('underscore')
, WebSocket = require('ws')
, config = require('./config.json');
/**
* Express setup
*/
var app = express();
config.directory = fs.realpathSync(process.argv[2]);
app.configure(function () {
app.set('port', process.env.PORT || 3000);
app.use(express.static(config.directory));
});
http.createServer(app)
.listen(app.get('port'), function () {
require('child_process')
.exec('open http://localhost:' + app.get('port') + ' '
+ config.chrome.app_path + ' --args'
+ ' --new-window --remote-debugging-port=' + config.chrome.debugging_port, function(err) {
if (err) console.log(err.message);
});
walk(config.directory);
console.log("Express server listening on port " + app.get('port'));
console.log("Watching directory: %s", config.directory);
});
var refreshBrowser = function(response) {
var pages = _.chain(response)
.filter(function(page) {
return (page.url.indexOf('http://localhost:' + app.get('port')) !== -1);
})
.map(function(page) {
return { id: parseInt(page.webSocketDebuggerUrl.match(/\/page\/([0-9]+)_[12]/)[1])
, socket: page.webSocketDebuggerUrl.replace('ws://', 'ws://localhost:' + config.chrome.debugging_port)
, url: page.url } })
.each(function(page) {
console.log('Reloading page... [%s] %s', page.id, page.url);
var ws = new WebSocket(page.socket);
ws.on('open', function() {
ws.send(JSON.stringify({ id: page.id
, method: 'Page.reload'
, params: { ignoreCache: true } })
, function(err) { ws.close(); });
});
});
};
var watch = function(file) {
fs.watchFile(file, function(curr, prev) {
if (curr.mtime > prev.mtime) {
request.get('http://localhost:' + config.chrome.debugging_port + '/json', function(e, res, body) {
refreshBrowser(body);
});
}
});
};
var walk = function(dir) {
fs.readdir(dir, function(err, filelist) {
_.chain(filelist)
.map(function(file) { return dir + '/' + file; })
.filter(function(file) {
return (_.contains(config.watch.extensions, _.last(file.split('.'))))
&& (!_.any(config.watch.exclusions, function(ex) { file.indexOf(ex) !== -1 }));
})
.each(function(file) {
fs.stat(file, function(err, stat) {
if (stat && stat.isDirectory()) {
walk(file);
} else {
watch(file);
}
});
});
});
};
{
"name": "dev",
"version": "0.1.0",
"main": "index.js",
"repository": "",
"author": "marshall007@mac.com",
"dependencies": {
"express": "~3.0.0rc5",
"underscore": "~1.4.2",
"ws": "~0.4.22",
"request": "~2.11.4"
}
}
@marshall007
Copy link
Author

Added features:

  1. Target directory can be passed in as an argument.
  2. Watches files based on extension w/ the ability to exclude directories.
  3. Auto-reloads any open tabs in Chrome that are pointed at localhost:.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment