build-scripts/lib/commands/start.js

scripts core

"use strict";
const chalk_1 = require("chalk");
const Context_1 = require("../core/Context");
const webpackStats_1 = require("../utils/webpackStats");
const deepmerge = require("deepmerge");
const WebpackDevServer = require("webpack-dev-server");
const prepareURLs = require("../utils/prepareURLs");
const log = require("../utils/log");
module.exports = async function ({ args, rootDir, eject, plugins, getBuiltInPlugins, }) {
    const command = 'start';
    const context = new Context_1.default({
        args,
        command,
        rootDir,
        plugins,
        getBuiltInPlugins,
    });
    log.verbose('OPTIONS', `${command} cliOptions: ${JSON.stringify(args, null, 2)}`);
    let serverUrl = '';
    const { applyHook, webpack } = context;
    let configArr = [];
    try {
        configArr = await context.setUp();
    }
    catch (err) {
        log.error('CONFIG', chalk_1.default.red('Failed to get config.'));
        await applyHook(`error`, { err });
        throw err;
    }
    await applyHook(`before.${command}.load`, { args });
    // eject config
    if (eject) {
        return configArr;
    }
    if (!configArr.length) {
        const errorMsg = 'No webpack config found.';
        log.warn('CONFIG', errorMsg);
        await applyHook(`error`, { err: new Error(errorMsg) });
        return;
    }
    let devServerConfig = {
        port: args.port || 3333,
        host: args.host || '0.0.0.0',
        https: args.https || false,
    };
    for (const item of configArr) {
        const { chainConfig } = item;
        const config = chainConfig.toConfig();
        if (config.devServer) {
            devServerConfig = deepmerge(devServerConfig, config.devServer);
        }
        // if --port or process.env.PORT has been set, overwrite option port
        if (process.env.USE_CLI_PORT) {
            devServerConfig.port = args.port;
        }
    }
    await applyHook(`before.${command}.run`);
    const webpackConfig = configArr.map(v => v.chainConfig.toConfig());
    let compiler;
    try {
        compiler = webpack(webpackConfig);
    }
    catch (err) {
        log.error('CONFIG', chalk_1.default.red('Failed to load webpack config.'));
        await applyHook(`error`, { err });
        throw err;
    }
    const protocol = devServerConfig.https ? 'https' : 'http';
    const urls = prepareURLs(protocol, devServerConfig.host, devServerConfig.port);
    serverUrl = urls.localUrlForBrowser;
    let isFirstCompile = true;
    // typeof(stats) is webpack.compilation.MultiStats
    compiler.hooks.done.tap('compileHook', async (stats) => {
        const isSuccessful = webpackStats_1.default({
            urls,
            stats,
            isFirstCompile,
        });
        if (isSuccessful) {
            isFirstCompile = false;
        }
        await applyHook(`after.${command}.compile`, {
            url: serverUrl,
            urls,
            isFirstCompile,
            stats,
        });
    });
    const devServer = new WebpackDevServer(compiler, devServerConfig);
    await applyHook(`before.${command}.devServer`, {
        url: serverUrl,
        urls,
        devServer,
    });
    devServer.listen(devServerConfig.port, devServerConfig.host, async (err) => {
        if (err) {
            log.info('WEBPACK', chalk_1.default.red('[ERR]: Failed to start webpack dev server'));
            log.error('WEBPACK', (err.stack || err.toString()));
        }
        await applyHook(`after.${command}.devServer`, {
            url: serverUrl,
            urls,
            devServer,
            err,
        });
    });
    return devServer;
};