Nutritious Pumpkin Masses

    webpack-isomorphic-compiler

    3.1.1 • Public • Published

    webpack-isomorphic-compiler

    NPM version Downloads Build Status Coverage Status Dependency status Dev Dependency status Greenkeeper badge

    A compiler that makes your life easier if you are building isomorphic webpack powered apps, that is, single page applications with server-side rendering.

    Installation

    $ npm install webpack-isomorphic-compiler --save-dev

    The current version works with webpack v2, v3 and v4.

    Motivation

    With webpack, client-side applications with server-side rendering means compiling both the client and the server.
    To make it right, the client and server compilers must be in sync and live in perfect harmony.

    Webpack offers a multi-compiler that makes this possible, but unfortunately it doesn't have all the plugin handlers that a single compiler does. This makes it difficult to know what's happening under the hood.

    This module packs an aggregated compiler that:

    NOTE: While webpack-sane-compiler-reporter is compatible with this compiler, we advise using webpack-isomorphic-compiler-reporter instead for completeness and accurateness.

    Usage

    const webpack = require('webpack');
    const isomorphicWebpack = require('webpack-isomorphic-compiler');
     
    const clientCompiler = webpack(/* client config */);
    const serverCompiler =  webpack(/* server config */);
    const compiler = isomorphicWebpack(clientCompiler, serverCompiler);

    Alternatively, you may pass a config directly instead of a webpack compiler:

    const webpack = require('webpack');
     
    const compiler = isomorphicWebpack(/* client config */, /* server config */);

    The returned compiler has exactly the same API as the webpack-sane-compiler but adds some functionality that is detailed below.

    Compilation result

    The compilation result, available through .run(), .watch(), .getCompilation() and .resolve(), has two more properties:

    compiler.run()
    .then(({ clientStats, serverStats, stats, duration }) => {
        // clientStats is the webpack stats of the client
        // serverStats is the webpack stats of the client
        // duration is the aggregated compilation duration
        // stats maps to clientStats for API compatibility
    })

    Client & server webpack

    Both client and server properties contain their webpack configs & compilers.

    Name Description Type
    webpackCompiler The client's webpack compiler Compiler
    webpackConfig The client's webpack config object

    Accessing webpack compiler public methods is NOT allowed and will throw an error.

    Related projects

    You may also want to look at:

    Tests

    $ npm test
    $ npm test -- --watch during development

    License

    MIT License

    Install

    npm i webpack-isomorphic-compiler

    DownloadsWeekly Downloads

    422

    Version

    3.1.1

    License

    MIT

    Unpacked Size

    16.1 kB

    Total Files

    6

    Last publish

    Collaborators

    • tiagodinis
    • moxyhq
    • filipediasf
    • satazor
    • marcooliveira
    • acostalima
    • andregoncalvesdev