alm/src/server/devtime.js

The best IDE for TypeScript

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
/**
 * Dev time server for front-end
 */
var config = require("../webpack.config");
var path = require("path");
var fs = require("fs");
var getPort_1 = require("./utils/getPort");
var devtimeDetectionFile = __dirname + '/devtime.txt';
var webpackDevServerPort = 0;
var devTimeProxy = null;
var bundleDevTimeProxy = function () {
    if (devTimeProxy)
        return devTimeProxy;
    /**
     * Provide a proxy server that will pass your requests to webpack if a webpack port is found
     */
    var httpProxy = require('http-proxy');
    var proxyServer = httpProxy.createProxyServer();
    devTimeProxy = function (req, res, next) {
        if (!webpackDevServerPort)
            next();
        proxyServer.web(req, res, {
            target: "http://127.0.0.1:" + webpackDevServerPort
        });
        proxyServer.on('error', function (err) {
            console.log('[WDS] Proxy ERROR', err);
        });
    };
    getPort_1.getPort(8888).then(function (port) {
        // console.log('found port', port); // DEBUG
        webpackDevServerPort = port;
        var Webpack = require('webpack');
        var WebpackDevServer = require('webpack-dev-server');
        var notification = '[WDS]'; // Webpack dev server
        /**
         * Update the prod config for dev time ease
         */
        var devConfig = Object.create(config);
        // Makes sure errors in console map to the correct file and line number
        devConfig.devtool = 'eval';
        // Add aditional entry points
        devConfig.entry = [
            // For hot style updates
            require.resolve('webpack/hot/dev-server'),
            // The script refreshing the browser on hot updates
            require.resolve('webpack-dev-server/client') + "?http://127.0.0.1:" + webpackDevServerPort,
        ].concat(config.entry);
        // Add the Hot Replacement plugin for hot style updates
        devConfig.plugins.push(new Webpack.HotModuleReplacementPlugin());
        /**
         * Standard webpack bundler stuff
         */
        var compiler = Webpack(devConfig);
        compiler.plugin('compile', function () {
            console.log(notification + " Bundling ..... ");
        });
        compiler.plugin('done', function (result) {
            console.log(notification + " Bundled in " + (result.endTime - result.startTime) + " ms!");
        });
        /**
         * Wrap up the bundler in a dev server
         */
        var bundler = new WebpackDevServer(compiler, {
            // We need to tell Webpack to serve our bundled application
            // from the build path. When proxying
            publicPath: '/build/',
            // Configure hot replacement
            hot: true,
            // The rest is terminal configurations
            quiet: true,
            noInfo: true,
            stats: {
                colors: true
            }
        });
        /** Listen on all local address. If we don't then our `getPort` breaks on a mac */
        bundler.listen(webpackDevServerPort, '0.0.0.0', function () {
            console.log(notification + " Server listening on port: " + webpackDevServerPort);
        });
    });
    return devTimeProxy;
};
function bundleDeploy() {
    // build
    var Webpack = require('webpack');
    var compiler = Webpack(config);
    compiler.run(function (err, stats) {
        if (err) {
            console.error('Failed to refresh bundle', err);
        }
        else {
            console.log('Refreshed bundle');
        }
    });
}
function addDevHeaders(res) {
    res.setHeader('Cache-Control', 'no-cache, no-store, must-revalidate');
    res.setHeader('Pragma', 'no-cache');
    res.setHeader('Expires', '0');
}
function setup(app) {
    /**
     * We always refresh the build bundle if it isn't there.
     * This is to help *new repo clones* . NPM installs get this file by default.
     */
    var outFile = path.join(config.output.path, config.output.filename);
    if (!fs.existsSync(outFile)) {
        bundleDeploy();
    }
    /**
     * Check for devtime
     */
    var devTime = fs.existsSync(devtimeDetectionFile);
    if (devTime) {
        // if started with dev mode start the bundling process immediately
        bundleDevTimeProxy();
    }
    /**
     * Proxies to dev server if devtime
     */
    app.all('/build/*', function (req, res, next) {
        if (devTime) {
            bundleDevTimeProxy()(req, res, next);
        }
        else {
            next();
        }
    });
    /**
     * Disables caching if devtime
     */
    app.use('/', function (req, res, next) {
        if (devTime) {
            addDevHeaders(res);
        }
        next();
    });
    /**
     * Dev time vs. prod time toggling
     */
    app.use('/dev', function (req, res, next) {
        addDevHeaders(res);
        devTime = true;
        fs.writeFileSync(devtimeDetectionFile, 'If this file exists the server will start in dev mode');
        res.send('Hot Reload setup!');
    });
    app.use('/prod', function (req, res, next) {
        bundleDeploy();
        addDevHeaders(res);
        if (devTime) {
            devTime = false;
            fs.unlinkSync(devtimeDetectionFile);
        }
        res.send('Using static bundled files');
    });
}
exports.setup = setup;