Skip to content

teux/webpack-koa-middleware

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

4 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

For development purposes only!

Webpack middleware for koa

Wraps webpack-dev-middleware for use in koa. Adds hot module replacement (HMR).

Webpack is the webpack and it's module bundler. Koa is the next generation web framework for node.js.

Install

npm install webpack-koa-middleware

Usage

Configure and attach middleware:

var middleware = require('webpack-koa-middleware');
var webpackCfg = require('webpack-cfg.js');

app.use(middleware(webpackCfg));

, where app is koa instance.

Exemple of webpack-cfg.js (look on devServer key):

module.exports = {
    // Modules root directory
    context: path.join(__dirname, './app'),

    // Entry points for the build
    entry: {
        index: './index.js'     // also used in devServer config below
    },

    // Where and how to expose build results
    output: {
        publicPath: '/',        // Where bundles (build results) are served 
                                // (not path, just prefix for requests)
        filename: '[name].js',
        chunkFilename: '[name].[chunkhash].js'
    },
    
    // Development server configuration
    devServer: {
        host: process.env.USER_IP || 'localhost',
        port: 8090,
        publicPath: '/',        // Where webpack exposes bundles
                                //  on its own in-memory file system 
        hot: true,              // Switch on Hot Module Replacement
        indexEntry: 'index',    // Entry to add HNR code to (EntryChunk or CommonsChunk)
        secure: true,           // use https or http
        stats: {
            colors: true,
            hash: false,
            timings: false,
            assets: true,
            chunks: true,
            chunkModules: true,
            modules: false,
            children: true
        }
    }
}

For an explanation of parameters see webpack documentation.

Explicit call

Middlewares executed in a stack-like manner upon request. Sometimes you need to explicitly retrieve data from webpack's virtual file system.

This middleware has function asset which takes URL and returns promise which is fulfilled with asset's content.

var middleware = require('webpack-koa-middleware');
var webpackCfg = require('webpack-cfg.js');

middleware = middleware(webpackCfg) 
middleware.asset('/app.js')
    .then(function (content) {
        console.log(content instanceof Buffer); // => true
    });

About

Webpack koa middleware with HMR support

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published