@umijs/bundler-webpack 4.0.0-canary.20220429.2 → 4.0.0-canary.20220506.1

package/dist/build.d.ts

@@ -0,0 +1,20 @@
+import webpack from '../compiled/webpack';
+import { IOpts as IConfigOpts } from './config/config';
+import { IConfig } from './types';
+declare type IOpts = {
+    cwd: string;
+    rootDir?: string;
+    entry: Record<string, string>;
+    config: IConfig;
+    onBuildComplete?: Function;
+    babelPreset?: any;
+    chainWebpack?: Function;
+    modifyWebpackConfig?: Function;
+    beforeBabelPlugins?: any[];
+    beforeBabelPresets?: any[];
+    extraBabelPlugins?: any[];
+    extraBabelPresets?: any[];
+    clean?: boolean;
+} & Pick<IConfigOpts, 'cache'>;
+export declare function build(opts: IOpts): Promise<webpack.Stats>;
+export {};

package/dist/build.js

@@ -0,0 +1,64 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.build = void 0;
+const utils_1 = require("@umijs/utils");
+const webpack_1 = __importDefault(require("../compiled/webpack"));
+const config_1 = require("./config/config");
+const types_1 = require("./types");
+async function build(opts) {
+    const webpackConfig = await (0, config_1.getConfig)({
+        cwd: opts.cwd,
+        rootDir: opts.rootDir,
+        env: types_1.Env.production,
+        entry: opts.entry,
+        userConfig: opts.config,
+        analyze: process.env.ANALYZE,
+        babelPreset: opts.babelPreset,
+        extraBabelPlugins: [
+            ...(opts.beforeBabelPlugins || []),
+            ...(opts.extraBabelPlugins || []),
+        ],
+        extraBabelPresets: [
+            ...(opts.beforeBabelPresets || []),
+            ...(opts.extraBabelPresets || []),
+        ],
+        extraBabelIncludes: opts.config.extraBabelIncludes,
+        chainWebpack: opts.chainWebpack,
+        modifyWebpackConfig: opts.modifyWebpackConfig,
+        cache: opts.cache,
+    });
+    let isFirstCompile = true;
+    return new Promise((resolve, reject) => {
+        utils_1.rimraf.sync(webpackConfig.output.path);
+        const compiler = (0, webpack_1.default)(webpackConfig);
+        compiler.run((err, stats) => {
+            var _a;
+            (_a = opts.onBuildComplete) === null || _a === void 0 ? void 0 : _a.call(opts, {
+                err,
+                stats,
+                isFirstCompile,
+                time: stats ? stats.endTime - stats.startTime : null,
+            });
+            isFirstCompile = false;
+            if (err || (stats === null || stats === void 0 ? void 0 : stats.hasErrors())) {
+                if (err) {
+                    // console.error(err);
+                    reject(err);
+                }
+                if (stats) {
+                    const errorMsg = stats.toString('errors-only');
+                    // console.error(errorMsg);
+                    reject(new Error(errorMsg));
+                }
+            }
+            else {
+                resolve(stats);
+            }
+            compiler.close(() => { });
+        });
+    });
+}
+exports.build = build;

package/dist/cli.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/cli.js

@@ -0,0 +1,81 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const esbuild_1 = __importDefault(require("@umijs/bundler-utils/compiled/esbuild"));
+const utils_1 = require("@umijs/utils");
+const assert_1 = __importDefault(require("assert"));
+const fs_1 = require("fs");
+const path_1 = require("path");
+const build_1 = require("./build");
+const dev_1 = require("./dev");
+const args = (0, utils_1.yParser)(process.argv.slice(2), {});
+const command = args._[0];
+const cwd = process.cwd();
+const entry = (0, utils_1.tryPaths)([
+    (0, path_1.join)(cwd, 'src/index.tsx'),
+    (0, path_1.join)(cwd, 'src/index.ts'),
+    (0, path_1.join)(cwd, 'index.tsx'),
+    (0, path_1.join)(cwd, 'index.ts'),
+]);
+let config = {};
+const configFile = (0, path_1.join)(cwd, args.config || 'config.ts');
+utils_1.register.register({
+    implementor: esbuild_1.default,
+});
+utils_1.register.clearFiles();
+if ((0, fs_1.existsSync)(configFile)) {
+    require('./requireHook');
+    config = require(configFile).default;
+}
+Object.assign(config, args);
+if (command === 'build') {
+    (async () => {
+        process.env.NODE_ENV = 'production';
+        (0, assert_1.default)(entry, `Build failed: entry not found.`);
+        try {
+            await (0, build_1.build)({
+                config,
+                cwd,
+                entry: {
+                    [getEntryKey(entry)]: entry,
+                },
+            });
+        }
+        catch (e) {
+            console.error(e);
+        }
+    })();
+}
+else if (command === 'dev') {
+    (async () => {
+        process.env.NODE_ENV = 'development';
+        try {
+            (0, assert_1.default)(entry, `Build failed: entry not found.`);
+            await (0, dev_1.dev)({
+                config,
+                cwd,
+                port: process.env.PORT,
+                entry: {
+                    [getEntryKey(entry)]: entry,
+                },
+                cache: {
+                    buildDependencies: [].filter(Boolean),
+                },
+            });
+        }
+        catch (e) {
+            console.error(e);
+        }
+    })();
+}
+else {
+    error(`Unsupported command ${command}.`);
+}
+function error(msg) {
+    console.error(utils_1.chalk.red(msg));
+}
+function getEntryKey(path) {
+    return (0, path_1.basename)(path, (0, path_1.extname)(path));
+}

package/dist/client/client.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/client/client.js

@@ -0,0 +1,245 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const strip_ansi_1 = __importDefault(require("@umijs/utils/compiled/strip-ansi"));
+// @ts-ignore
+const ErrorOverlay = __importStar(require("react-error-overlay"));
+const constants_1 = require("../constants");
+const formatWebpackMessages_1 = require("../utils/formatWebpackMessages");
+console.log('[webpack] connecting...');
+function getHost() {
+    if (process.env.SOCKET_SERVER) {
+        return new URL(process.env.SOCKET_SERVER);
+    }
+    return location;
+}
+function getSocketUrl() {
+    let h = getHost();
+    const host = h.host;
+    const isHttps = h.protocol === 'https:';
+    return `${isHttps ? 'wss' : 'ws'}://${host}`;
+}
+function getPingUrl() {
+    const h = getHost();
+    return `${h.protocol}//${h.host}/__umi_ping`;
+}
+let pingTimer = null;
+let isFirstCompilation = true;
+let mostRecentCompilationHash = null;
+let hasCompileErrors = false;
+let hadRuntimeError = false;
+const pingUrl = getPingUrl();
+const socket = new WebSocket(getSocketUrl(), 'webpack-hmr');
+socket.addEventListener('message', async ({ data }) => {
+    data = JSON.parse(data);
+    if (data.type === 'connected') {
+        console.log(`[webpack] connected.`);
+        // proxy(nginx, docker) hmr ws maybe caused timeout,
+        // so send ping package let ws keep alive.
+        pingTimer = setInterval(() => socket.send('ping'), 30000);
+    }
+    else {
+        handleMessage(data).catch(console.error);
+    }
+});
+async function waitForSuccessfulPing(ms = 1000) {
+    // eslint-disable-next-line no-constant-condition
+    while (true) {
+        try {
+            await fetch(pingUrl);
+            break;
+        }
+        catch (e) {
+            await new Promise((resolve) => setTimeout(resolve, ms));
+        }
+    }
+}
+socket.addEventListener('close', async () => {
+    if (pingTimer)
+        clearInterval(pingTimer);
+    console.info('[webpack] Dev server disconnected. Polling for restart...');
+    await waitForSuccessfulPing();
+    location.reload();
+});
+ErrorOverlay.startReportingRuntimeErrors({
+    onError: function () {
+        hadRuntimeError = true;
+    },
+    filename: '/static/js/bundle.js',
+});
+// @ts-ignore
+if (module.hot && typeof module.hot.dispose === 'function') {
+    // @ts-ignore
+    module.hot.dispose(function () {
+        // TODO: why do we need this?
+        ErrorOverlay.stopReportingRuntimeErrors();
+    });
+}
+// There is a newer version of the code available.
+function handleAvailableHash(hash) {
+    // Update last known compilation hash.
+    mostRecentCompilationHash = hash;
+}
+function handleSuccess() {
+    const isHotUpdate = !isFirstCompilation;
+    isFirstCompilation = false;
+    hasCompileErrors = false;
+    // Attempt to apply hot updates or reload.
+    if (isHotUpdate) {
+        tryApplyUpdates(function onHotUpdateSuccess() {
+            // Only dismiss it when we're sure it's a hot update.
+            // Otherwise it would flicker right before the reload.
+            tryDismissErrorOverlay();
+        });
+    }
+}
+function handleWarnings(warnings) {
+    const isHotUpdate = !isFirstCompilation;
+    isFirstCompilation = false;
+    hasCompileErrors = false;
+    const formatted = (0, formatWebpackMessages_1.formatWebpackMessages)({
+        warnings,
+        errors: [],
+    });
+    // print warnings
+    if (typeof console !== 'undefined' && typeof console.warn === 'function') {
+        for (let i = 0; i < formatted.warnings.length; i++) {
+            if (i === 5) {
+                console.warn('There were more warnings in other files.\n' +
+                    'You can find a complete log in the terminal.');
+                break;
+            }
+            console.warn((0, strip_ansi_1.default)(formatted.warnings[i]));
+        }
+    }
+    // Attempt to apply hot updates or reload.
+    if (isHotUpdate) {
+        tryApplyUpdates(function onSuccessfulHotUpdate() {
+            // Only dismiss it when we're sure it's a hot update.
+            // Otherwise it would flicker right before the reload.
+            tryDismissErrorOverlay();
+        });
+    }
+}
+function handleErrors(errors) {
+    isFirstCompilation = false;
+    hasCompileErrors = true;
+    const formatted = (0, formatWebpackMessages_1.formatWebpackMessages)({
+        warnings: [],
+        errors,
+    });
+    // Only show the first error.
+    ErrorOverlay.reportBuildError(formatted.errors[0]);
+    // Also log them to the console.
+    if (typeof console !== 'undefined' && typeof console.error === 'function') {
+        for (let i = 0; i < formatted.errors.length; i++) {
+            console.error((0, strip_ansi_1.default)(formatted.errors[i]));
+        }
+    }
+}
+function tryDismissErrorOverlay() {
+    if (!hasCompileErrors) {
+        ErrorOverlay.dismissBuildError();
+    }
+}
+// Is there a newer version of this code available?
+function isUpdateAvailable() {
+    // @ts-ignore
+    return mostRecentCompilationHash !== __webpack_hash__;
+}
+function canApplyUpdates() {
+    // @ts-ignore
+    return module.hot.status() === 'idle';
+}
+function canAcceptErrors() {
+    // NOTE: This var is injected by Webpack's DefinePlugin, and is a boolean instead of string.
+    const hasReactRefresh = process.env.FAST_REFRESH;
+    // @ts-ignore
+    const status = module.hot.status();
+    // React refresh can handle hot-reloading over errors.
+    // However, when hot-reload status is abort or fail,
+    // it indicates the current update cannot be applied safely,
+    // and thus we should bail out to a forced reload for consistency.
+    return hasReactRefresh && ['abort', 'fail'].indexOf(status) === -1;
+}
+function tryApplyUpdates(onHotUpdateSuccess) {
+    // @ts-ignore
+    if (!module.hot) {
+        window.location.reload();
+        return;
+    }
+    if (!isUpdateAvailable() || !canApplyUpdates()) {
+        return;
+    }
+    function handleApplyUpdates(err, updatedModules) {
+        const haveErrors = err || hadRuntimeError;
+        // When there is no error but updatedModules is unavailable,
+        // it indicates a critical failure in hot-reloading,
+        // e.g. server is not ready to serve new bundle,
+        // and hence we need to do a forced reload.
+        const needsForcedReload = !err && !updatedModules;
+        if ((haveErrors && !canAcceptErrors()) || needsForcedReload) {
+            window.location.reload();
+        }
+        if (onHotUpdateSuccess)
+            onHotUpdateSuccess();
+        // While we were updating, there was a new update! Do it again.
+        if (isUpdateAvailable()) {
+            tryApplyUpdates();
+        }
+    }
+    // @ts-ignore
+    module.hot
+        .check(/* autoApply */ true)
+        .then((updatedModules) => {
+        handleApplyUpdates(null, updatedModules);
+    })
+        .catch((err) => {
+        handleApplyUpdates(err, null);
+    });
+}
+async function handleMessage(payload) {
+    // console.log('[payload]', payload);
+    switch (payload.type) {
+        case constants_1.MESSAGE_TYPE.hash:
+            handleAvailableHash(payload.data);
+            break;
+        case constants_1.MESSAGE_TYPE.stillOk:
+        case constants_1.MESSAGE_TYPE.ok:
+            handleSuccess();
+            break;
+        case constants_1.MESSAGE_TYPE.errors:
+            handleErrors(payload.data);
+            break;
+        case constants_1.MESSAGE_TYPE.warnings:
+            handleWarnings(payload.data);
+            break;
+        default:
+        // Do nothing
+    }
+}

package/dist/config/_sampleFeature.d.ts

@@ -0,0 +1,10 @@
+import Config from '@umijs/bundler-webpack/compiled/webpack-5-chain';
+import { Env, IConfig } from '../types';
+interface IOpts {
+    config: Config;
+    userConfig: IConfig;
+    cwd: string;
+    env: Env;
+}
+export declare function addSampleFeature(opts: IOpts): Promise<void>;
+export {};

package/dist/config/_sampleFeature.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.addSampleFeature = void 0;
+async function addSampleFeature(opts) {
+    const { config, userConfig, cwd, env } = opts;
+    config;
+    userConfig;
+    cwd;
+    env;
+}
+exports.addSampleFeature = addSampleFeature;

package/dist/config/assetRules.d.ts

@@ -0,0 +1,11 @@
+import Config from '@umijs/bundler-webpack/compiled/webpack-5-chain';
+import { Env, IConfig } from '../types';
+interface IOpts {
+    config: Config;
+    userConfig: IConfig;
+    cwd: string;
+    env: Env;
+    staticPathPrefix: string;
+}
+export declare function addAssetRules(opts: IOpts): Promise<void>;
+export {};

package/dist/config/assetRules.js

@@ -0,0 +1,50 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.addAssetRules = void 0;
+async function addAssetRules(opts) {
+    const { config, userConfig } = opts;
+    const inlineLimit = parseInt(userConfig.inlineLimit || '10000', 10);
+    const rule = config.module.rule('asset');
+    rule
+        .oneOf('avif')
+        .test(/\.avif$/)
+        .type('asset')
+        .mimetype('image/avif')
+        .parser({
+        dataUrlCondition: {
+            maxSize: inlineLimit,
+        },
+    })
+        .generator({
+        filename: `${opts.staticPathPrefix}[name].[hash:8].[ext]`,
+    });
+    rule
+        .oneOf('image')
+        .test(/\.(bmp|gif|jpg|jpeg|png)$/)
+        .type('asset')
+        .parser({
+        dataUrlCondition: {
+            maxSize: inlineLimit,
+        },
+    })
+        .generator({
+        filename: `${opts.staticPathPrefix}[name].[hash:8].[ext]`,
+    });
+    const fallback = rule
+        .oneOf('fallback')
+        .exclude.add(/^$/) /* handle data: resources */
+        .add(/\.(js|mjs|jsx|ts|tsx)$/)
+        .add(/\.(css|less|sass|scss|stylus)$/)
+        .add(/\.html$/)
+        .add(/\.json$/);
+    if (userConfig.mdx) {
+        fallback.add(/\.mdx?$/);
+    }
+    fallback
+        .end()
+        .type('asset/resource')
+        .generator({
+        filename: `${opts.staticPathPrefix}[name].[hash:8].[ext]`,
+    });
+}
+exports.addAssetRules = addAssetRules;

package/dist/config/bundleAnalyzerPlugin.d.ts

@@ -0,0 +1,10 @@
+import Config from '@umijs/bundler-webpack/compiled/webpack-5-chain';
+import { Env, IConfig } from '../types';
+interface IOpts {
+    config: Config;
+    userConfig: IConfig;
+    cwd: string;
+    env: Env;
+}
+export declare function addBundleAnalyzerPlugin(opts: IOpts): Promise<void>;
+export {};

package/dist/config/bundleAnalyzerPlugin.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.addBundleAnalyzerPlugin = void 0;
+// @ts-ignore
+const webpack_bundle_analyzer_1 = require("@umijs/bundler-webpack/compiled/webpack-bundle-analyzer");
+async function addBundleAnalyzerPlugin(opts) {
+    const { config } = opts;
+    config.plugin('webpack-bundle-analyzer').use(webpack_bundle_analyzer_1.BundleAnalyzerPlugin, [
+        // https://github.com/webpack-contrib/webpack-bundle-analyzer
+        {
+            analyzerMode: 'server',
+            analyzerPort: process.env.ANALYZE_PORT || 8888,
+            openAnalyzer: false,
+            logLevel: 'info',
+            defaultSizes: 'parsed',
+        },
+    ]);
+}
+exports.addBundleAnalyzerPlugin = addBundleAnalyzerPlugin;

package/dist/config/compressPlugin.d.ts

@@ -0,0 +1,10 @@
+import Config from '../../compiled/webpack-5-chain';
+import { Env, IConfig } from '../types';
+interface IOpts {
+    config: Config;
+    userConfig: IConfig;
+    cwd: string;
+    env: Env;
+}
+export declare function addCompressPlugin(opts: IOpts): Promise<void>;
+export {};

package/dist/config/compressPlugin.js

@@ -0,0 +1,83 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.addCompressPlugin = void 0;
+// @ts-ignore
+const css_minimizer_webpack_plugin_1 = __importDefault(require("@umijs/bundler-webpack/compiled/css-minimizer-webpack-plugin"));
+const terser_webpack_plugin_1 = __importDefault(require("../../compiled/terser-webpack-plugin"));
+const ESBuildCSSMinifyPlugin_1 = __importDefault(require("../plugins/ESBuildCSSMinifyPlugin"));
+const ParcelCSSMinifyPlugin_1 = require("../plugins/ParcelCSSMinifyPlugin");
+const types_1 = require("../types");
+const getEsBuildTarget_1 = require("../utils/getEsBuildTarget");
+async function addCompressPlugin(opts) {
+    const { config, userConfig, env } = opts;
+    const jsMinifier = userConfig.jsMinifier || types_1.JSMinifier.esbuild;
+    const cssMinifier = userConfig.cssMinifier || types_1.CSSMinifier.esbuild;
+    if (env === types_1.Env.development ||
+        process.env.COMPRESS === 'none' ||
+        (jsMinifier === types_1.JSMinifier.none && cssMinifier === types_1.CSSMinifier.none)) {
+        config.optimization.minimize(false);
+        return;
+    }
+    config.optimization.minimize(true);
+    let minify;
+    let terserOptions;
+    if (jsMinifier === types_1.JSMinifier.esbuild) {
+        minify = terser_webpack_plugin_1.default.esbuildMinify;
+        terserOptions = {
+            target: (0, getEsBuildTarget_1.getEsBuildTarget)({
+                targets: userConfig.targets || {},
+            }),
+        };
+    }
+    else if (jsMinifier === types_1.JSMinifier.terser) {
+        minify = terser_webpack_plugin_1.default.terserMinify;
+    }
+    else if (jsMinifier === types_1.JSMinifier.swc) {
+        minify = terser_webpack_plugin_1.default.swcMinify;
+    }
+    else if (jsMinifier === types_1.JSMinifier.uglifyJs) {
+        minify = terser_webpack_plugin_1.default.uglifyJsMinify;
+    }
+    else if (jsMinifier !== types_1.JSMinifier.none) {
+        throw new Error(`Unsupported jsMinifier ${userConfig.jsMinifier}.`);
+    }
+    terserOptions = {
+        ...terserOptions,
+        ...userConfig.jsMinifierOptions,
+    };
+    if (jsMinifier !== types_1.JSMinifier.none) {
+        config.optimization.minimizer(`js-${jsMinifier}`).use(terser_webpack_plugin_1.default, [
+            {
+                minify,
+                terserOptions,
+            },
+        ]);
+    }
+    if (cssMinifier === types_1.CSSMinifier.esbuild) {
+        config.optimization
+            .minimizer(`css-${cssMinifier}`)
+            .use(ESBuildCSSMinifyPlugin_1.default, [userConfig.cssMinifierOptions]);
+    }
+    else if (cssMinifier === types_1.CSSMinifier.cssnano) {
+        config.optimization
+            .minimizer(`css-${cssMinifier}`)
+            .use(css_minimizer_webpack_plugin_1.default, [
+            {
+                minimizerOptions: userConfig.cssMinifierOptions,
+                parallel: true,
+            },
+        ]);
+    }
+    else if (cssMinifier === types_1.CSSMinifier.parcelCSS) {
+        config.optimization
+            .minimizer(`css-${cssMinifier}`)
+            .use(ParcelCSSMinifyPlugin_1.ParcelCSSMinifyPlugin);
+    }
+    else if (cssMinifier !== types_1.CSSMinifier.none) {
+        throw new Error(`Unsupported cssMinifier ${userConfig.cssMinifier}.`);
+    }
+}
+exports.addCompressPlugin = addCompressPlugin;

package/dist/config/config.d.ts

@@ -0,0 +1,27 @@
+import { Configuration } from '../../compiled/webpack';
+import { Env, IConfig } from '../types';
+export interface IOpts {
+    cwd: string;
+    rootDir?: string;
+    env: Env;
+    entry: Record<string, string>;
+    extraBabelPresets?: any[];
+    extraBabelPlugins?: any[];
+    extraBabelIncludes?: string[];
+    extraEsbuildLoaderHandler?: any[];
+    babelPreset?: any;
+    chainWebpack?: Function;
+    modifyWebpackConfig?: Function;
+    hash?: boolean;
+    hmr?: boolean;
+    staticPathPrefix?: string;
+    userConfig: IConfig;
+    analyze?: any;
+    name?: string;
+    cache?: {
+        absNodeModulesPath?: string;
+        buildDependencies?: string[];
+        cacheDirectory?: string;
+    };
+}
+export declare function getConfig(opts: IOpts): Promise<Configuration>;