Nebulous Puffy Marshmallows

    express-reloadable

    2.0.2 • Public • Published

    Why express-reloadable

    Express is a well known web application framework, but it lacks a standard way to hot reload your application code without a server restart. This hurts even more if you are used to develop with a HMR alike development workflow in your react/angular layer through webpack.

    Express-reloadable is a way to get HMR like code reload in your express applications.

    How does it work?

    We leverage the existing router feature of express and wire it together with the fantastic file-watch library chokidar. The express router will be reloaded if we detect any file change.

    Installation

    npm install express-reloadable chokidar
    

    Getting started

    You will have at least two files.

    ./router.js

    export default (app) => {
      app.get("/hello", (req, res) => {
        res.send("world")
      })
    }
    

    The router file will be reloaded whenever itself or any imported/required resources will change.

    ./server.js

    import express from "express"
    import path from "path"
    import reloadable from "express-reloadable"
    
    const app = express()
    
    reloadable(app, {
      requireFile: path.resolve(__dirname, "./router"),
      watch: path.resolve(__dirname),
    })
    
    app.listen(9090)
    

    Nothing really new in the server file. You bootstrap your express application as before. But you pass your application object the "reloadable()" function right before you start listening for any requests.

    See the example folder for a fully working demo application

    Reloadable configuration options:

    Name Default Description
    requireFile n/a The file to (re-)require on reload
    watch n/a Paths to files, dirs to be watched recursively, or glob patterns. See https://github.com/paulmillr/chokidar#api for details.
    clearIf (file) => file.indexOf("node_modules") === -1 A reload is only triggered if this functions returns a truthy value.

    How to release allocated resources on reload?

    Express-reloadable supports the notion of a tearDown function. The tearDown function is called before the reload happend and gives you a chance to release any allocated resources.

    // this will be executed on every reload
    let databaseConnection = initDb()
    
    export function tearDown(){
      // release the databaseConnection on reload
      databaseConnection.release()
    }
    
    export default (app) => {
      app.get("/hello", (req, res) => {
        res.send("world")
      })
    }
    

    Integration with webpack-dev-server

    Just use the existing setup hook of devServer in your webpack.config.js

    import path from "path"
    
    module.exports = {
      // ... 
      // add your existing webpack config here
      // ...
      devServer: {
        setup(app){
          let srcDir = path.resolve(__dirname, "src")
          reloadable(app, {
            requireFile: path.join(srcDir, "./router"),
            watch: srcDir,
          })
        }  
      }
    }
    

    This will add your reloadable application routes from ./router available right on the webpack-dev-server instance. Same start script, same process, same logfile ... can't be any easier.

    License

    Express-reloadable is released under the MIT license.

    Install

    npm i express-reloadable

    DownloadsWeekly Downloads

    55

    Version

    2.0.2

    License

    MIT

    Last publish

    Collaborators

    • jzimmek