@umijs/bundler-webpack 4.0.0-canary.20220615.2 → 4.0.0-canary.20220628.1

package/dist/build.js

@@ -32,7 +32,9 @@ async function build(opts) {
     });
     let isFirstCompile = true;
     return new Promise((resolve, reject) => {
-        utils_1.rimraf.sync(webpackConfig.output.path);
+        if (opts.clean) {
+            utils_1.rimraf.sync(webpackConfig.output.path);
+        }
         const compiler = (0, webpack_1.default)(webpackConfig);
         compiler.run((err, stats) => {
             var _a;

package/dist/config/assetRules.js

@@ -14,9 +14,6 @@ async function addAssetRules(opts) {
         dataUrlCondition: {
             maxSize: inlineLimit,
         },
-    })
-        .generator({
-        filename: `${opts.staticPathPrefix}[name].[hash:8].[ext]`,
     });
     rule
         .oneOf('image')
@@ -26,9 +23,6 @@ async function addAssetRules(opts) {
         dataUrlCondition: {
             maxSize: inlineLimit,
         },
-    })
-        .generator({
-        filename: `${opts.staticPathPrefix}[name].[hash:8].[ext]`,
     });
     const fallback = rule
         .oneOf('fallback')
@@ -40,11 +34,6 @@ async function addAssetRules(opts) {
     if (userConfig.mdx) {
         fallback.add(/\.mdx?$/);
     }
-    fallback
-        .end()
-        .type('asset/resource')
-        .generator({
-        filename: `${opts.staticPathPrefix}[name].[hash:8].[ext]`,
-    });
+    fallback.end().type('asset/resource');
 }
 exports.addAssetRules = addAssetRules;

package/dist/config/config.js

@@ -28,6 +28,7 @@ const miniCSSExtractPlugin_1 = require("./miniCSSExtractPlugin");
 const nodePolyfill_1 = require("./nodePolyfill");
 const progressPlugin_1 = require("./progressPlugin");
 const speedMeasureWebpackPlugin_1 = require("./speedMeasureWebpackPlugin");
+const ssrPlugin_1 = __importDefault(require("./ssrPlugin"));
 const svgRules_1 = require("./svgRules");
 async function getConfig(opts) {
     const { userConfig } = opts;
@@ -70,14 +71,15 @@ async function getConfig(opts) {
             : userConfig.devtool || constants_1.DEFAULT_DEVTOOL
         : userConfig.devtool);
     // output
-    const absOutputPath = (0, path_1.join)(opts.cwd, userConfig.outputPath || constants_1.DEFAULT_OUTPUT_PATH);
+    const absOutputPath = (0, path_1.resolve)(opts.cwd, userConfig.outputPath || constants_1.DEFAULT_OUTPUT_PATH);
     const disableCompress = process.env.COMPRESS === 'none';
     config.output
         .path(absOutputPath)
         .filename(useHash ? `[name].[contenthash:8].js` : `[name].js`)
         .chunkFilename(useHash ? `[name].[contenthash:8].async.js` : `[name].async.js`)
         .publicPath(userConfig.publicPath || 'auto')
-        .pathinfo(isDev || disableCompress);
+        .pathinfo(isDev || disableCompress)
+        .set('assetModuleFilename', `${applyOpts.staticPathPrefix}[name].[hash:8][ext]`);
     // resolve
     // prettier-ignore
     config.resolve
@@ -138,6 +140,8 @@ async function getConfig(opts) {
     if (isDev && opts.hmr) {
         config.plugin('hmr').use(webpack_1.default.HotModuleReplacementPlugin);
     }
+    // ssr
+    await (0, ssrPlugin_1.default)(applyOpts);
     // compress
     await (0, compressPlugin_1.addCompressPlugin)(applyOpts);
     // purgecss

package/dist/config/copyPlugin.js

@@ -4,23 +4,20 @@ exports.addCopyPlugin = void 0;
 const fs_1 = require("fs");
 const path_1 = require("path");
 async function addCopyPlugin(opts) {
+    var _a;
     const { config, userConfig, cwd } = opts;
     const copyPatterns = [
         (0, fs_1.existsSync)((0, path_1.join)(cwd, 'public')) && {
             from: (0, path_1.join)(cwd, 'public'),
         },
         ...(userConfig.copy
-            ? userConfig.copy.map((item) => {
-                if (typeof item === 'string') {
-                    return {
-                        from: (0, path_1.join)(cwd, item),
-                        to: item,
-                    };
+            ? (_a = userConfig.copy) === null || _a === void 0 ? void 0 : _a.map((pattern) => {
+                if (typeof pattern === 'string') {
+                    return (0, path_1.resolve)(cwd, pattern);
                 }
                 return {
-                    // 相对于 process.cwd，所以这里需要使用绝对路径
-                    from: (0, path_1.join)(cwd, item.from),
-                    to: item.to,
+                    from: (0, path_1.resolve)(cwd, pattern.from),
+                    to: (0, path_1.resolve)(cwd, pattern.to),
                 };
             })
             : []),

package/dist/config/cssRules.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.addCSSRules = void 0;
+const utils_1 = require("@umijs/utils");
 async function addCSSRules(opts) {
     const { config, userConfig } = opts;
     const rulesConfig = [
@@ -71,6 +72,23 @@ async function addCSSRules(opts) {
                         modules: {
                             localIdentName: '[local]___[hash:base64:5]',
                             ...userConfig.cssLoaderModules,
+                            // If SSR is enabled, we need to handling the css modules name hashing
+                            // and save the class names mapping into opts.cssModulesMapping
+                            // so the esbuild can use it to generate the correct name for the server side
+                            getLocalIdent: userConfig.ssr &&
+                                ((context, localIdentName, localName, opt) => {
+                                    const classIdent = ((0, utils_1.winPath)(context.resourcePath).replace((0, utils_1.winPath)(ensureLastSlash(opt.context)), '') +
+                                        '@' +
+                                        localName).trim();
+                                    let hash = Buffer.from(classIdent)
+                                        .toString('base64')
+                                        .replace(/=/g, '');
+                                    hash = hash.substring(hash.length - 5);
+                                    const result = localIdentName
+                                        .replace(/\[local]/g, localName)
+                                        .replace(/\[hash[^\[]*?]/g, hash);
+                                    return result;
+                                }),
                         },
                     }
                     : {}),
@@ -106,3 +124,6 @@ async function addCSSRules(opts) {
     }
 }
 exports.addCSSRules = addCSSRules;
+function ensureLastSlash(path) {
+    return path.endsWith('/') ? path : path + '/';
+}

package/dist/config/manifestPlugin.d.ts

@@ -1,5 +1,5 @@
 import Config from '@umijs/bundler-webpack/compiled/webpack-5-chain';
-import { Env, IConfig } from '../types';
+import type { Env, IConfig } from '../types';
 interface IOpts {
     name?: string;
     config: Config;

package/dist/config/miniCSSExtractPlugin.js

@@ -13,7 +13,10 @@ async function addMiniCSSExtractPlugin(opts) {
         config.plugin('mini-css-extract-plugin').use(mini_css_extract_plugin_1.default, [
             {
                 filename: `[name]${hash}.css`,
-                chunkFilename: `[name]${hash}.chunk.css`,
+                chunkFilename: opts.userConfig.ssr
+                    ? // TODO: FIXME
+                        `umi${hash}.css`
+                    : `[name]${hash}.chunk.css`,
                 ignoreOrder: true,
             },
         ]);

package/dist/config/ssrPlugin.d.ts

@@ -0,0 +1,11 @@
+import Config from '../../compiled/webpack-5-chain';
+import { Env, IConfig } from '../types';
+interface IOpts {
+    name?: string;
+    config: Config;
+    userConfig: IConfig;
+    cwd: string;
+    env: Env;
+}
+export default function addSSRPlugin(opts: IOpts): void;
+export {};

package/dist/config/ssrPlugin.js

@@ -0,0 +1,66 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const webpack_1 = require("@umijs/bundler-webpack/compiled/webpack");
+const utils_1 = require("@umijs/utils");
+const fs_1 = require("fs");
+const path_1 = require("path");
+const constants_1 = require("../constants");
+const PLUGIN_NAME = 'SSR_PLUGIN';
+class SSRPlugin {
+    constructor(opts) {
+        this.opts = opts;
+        this.manifest = new Map();
+    }
+    apply(compiler) {
+        // ref: https://github.com/webdeveric/webpack-assets-manifest
+        compiler.hooks.compilation.tap(PLUGIN_NAME, (compilation) => {
+            compilation.hooks.processAssets.tap(PLUGIN_NAME, () => {
+                const publicPath = compiler.options.output.publicPath || '/';
+                const assets = compilation.getAssets().filter((asset) => {
+                    if (asset.info.hotModuleReplacement) {
+                        return false;
+                    }
+                    return true;
+                });
+                assets.forEach((asset) => {
+                    if (asset.info.sourceFilename) {
+                        this.manifest.set(asset.info.sourceFilename, publicPath + asset.name);
+                    }
+                });
+                const stats = compilation.getStats().toJson({
+                    all: false,
+                    assets: true,
+                    cachedAssets: true,
+                    cachedModules: true,
+                });
+                const { assetsByChunkName } = stats;
+                Object.keys(assetsByChunkName).forEach((chunkName) => {
+                    assetsByChunkName[chunkName].forEach((filename) => {
+                        const ext = (0, path_1.extname)(filename.split(/[?#]/)[0]);
+                        if (!filename.includes('.hot-update.')) {
+                            this.manifest.set(chunkName + ext, publicPath + filename);
+                        }
+                    });
+                });
+                const assetsSource = JSON.stringify({
+                    assets: Object.fromEntries(this.manifest),
+                }, null, 2);
+                if (process.env.NODE_ENV === 'production' ||
+                    this.opts.userConfig.writeToDisk) {
+                    compilation.emitAsset('build-manifest.json', new webpack_1.sources.RawSource(assetsSource, false));
+                }
+                else {
+                    const outputPath = compiler.options.output.path;
+                    utils_1.fsExtra.mkdirpSync(outputPath);
+                    (0, fs_1.writeFileSync)((0, path_1.join)(outputPath, 'build-manifest.json'), assetsSource, 'utf-8');
+                }
+            });
+        });
+    }
+}
+function addSSRPlugin(opts) {
+    if (opts.userConfig.ssr && opts.name !== constants_1.MFSU_NAME) {
+        opts.config.plugin('ssr-plugin').use(SSRPlugin, [opts]);
+    }
+}
+exports.default = addSSRPlugin;

package/dist/config/svgRules.js

@@ -35,20 +35,14 @@ async function addSVGRules(opts) {
             .loader(require.resolve('@umijs/bundler-webpack/compiled/url-loader'))
             .end();
     }
-    if (svgo === false) {
+    if (svgo !== false) {
         const svgRule = config.module.rule('svg');
         svgRule
             .test(/\.svg$/)
-            .use('url-loader')
-            .loader(require.resolve('@umijs/bundler-webpack/compiled/url-loader'));
-        return;
+            .use('svgo-loader')
+            .loader(require.resolve('@umijs/bundler-webpack/compiled/svgo-loader'))
+            .options({ configFile: false, ...svgo })
+            .end();
     }
-    const svgRule = config.module.rule('svg');
-    svgRule
-        .test(/\.svg$/)
-        .use('svgo-loader')
-        .loader(require.resolve('@umijs/bundler-webpack/compiled/svgo-loader'))
-        .options({ configFile: false, ...svgo })
-        .end();
 }
 exports.addSVGRules = addSVGRules;

package/dist/dev.js

@@ -75,7 +75,7 @@ async function dev(opts) {
         extraEsbuildLoaderHandler: (mfsu === null || mfsu === void 0 ? void 0 : mfsu.getEsbuildLoaderHandler()) || [],
         chainWebpack: opts.chainWebpack,
         modifyWebpackConfig: opts.modifyWebpackConfig,
-        hmr: true,
+        hmr: process.env.HMR !== 'none',
         analyze: process.env.ANALYZE,
         cache: opts.cache,
     });

package/dist/index.d.ts

@@ -1,8 +1,11 @@
+import * as parcelCSS from '@parcel/css';
 import type webpack from '../compiled/webpack';
+import './requireHook';
 export type { RequestHandler } from '@umijs/bundler-utils/compiled/express';
 export type { Compiler, Stats } from '../compiled/webpack';
 export * from './build';
 export * from './config/config';
 export * from './dev';
 export * from './schema';
+export { parcelCSS };
 export { webpack };

package/dist/index.js

@@ -10,10 +10,26 @@ var __createBinding = (this && this.__createBinding) || (Object.create ? (functi
     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 __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.parcelCSS = void 0;
+const parcelCSS = __importStar(require("@parcel/css"));
+exports.parcelCSS = parcelCSS;
+require("./requireHook");
 __exportStar(require("./build"), exports);
 __exportStar(require("./config/config"), exports);
 __exportStar(require("./dev"), exports);

package/dist/plugins/ProgressPlugin.js

@@ -12,8 +12,9 @@ class UmiProgressPlugin extends webpack_1.ProgressPlugin {
         };
     }
     apply(compiler) {
+        const prefix = this.options.name ? `[${this.options.name}]` : '[Webpack]';
         compiler.hooks.invalid.tap(PLUGIN_NAME, () => {
-            utils_1.logger.wait('Compiling...');
+            utils_1.logger.wait(`${prefix} Compiling...`);
         });
         compiler.hooks.done.tap(PLUGIN_NAME, (stats) => {
             const { errors, warnings } = stats.toJson({
@@ -32,8 +33,7 @@ class UmiProgressPlugin extends webpack_1.ProgressPlugin {
                 });
             }
             else {
-                const prefix = this.options.name ? `${this.options.name} ` : '';
-                utils_1.logger.event(`${prefix}Compiled successfully in ${stats.endTime - stats.startTime} ms (${stats.compilation.modules.size} modules)`);
+                utils_1.logger.event(`${prefix} Compiled in ${stats.endTime - stats.startTime} ms (${stats.compilation.modules.size} modules)`);
             }
         });
     }

package/dist/schema.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="hapi__joi" />
-import type { Root } from '@hapi/joi';
+import type { Root } from '@umijs/utils/compiled/@hapi/joi';
 export declare function getSchemas(): Record<string, (Joi: Root) => any>;

package/dist/server/server.js

@@ -138,10 +138,11 @@ async function createServer(opts) {
                 app.use(key, (0, http_proxy_middleware_1.createProxyMiddleware)(key, {
                     ...proxy[key],
                     // Add x-real-url in response header
-                    onProxyRes(proxyRes, req) {
-                        var _a;
+                    onProxyRes(proxyRes, req, res) {
+                        var _a, _b;
                         proxyRes.headers['x-real-url'] =
                             ((_a = new URL(req.url || '', target)) === null || _a === void 0 ? void 0 : _a.href) || '';
+                        (_b = proxyConfig.onProxyRes) === null || _b === void 0 ? void 0 : _b.call(proxyConfig, proxyRes, req, res);
                     },
                 }));
             }

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@umijs/bundler-webpack",
-  "version": "4.0.0-canary.20220615.2",
+  "version": "4.0.0-canary.20220628.1",
   "description": "@umijs/bundler-webpack",
-  "homepage": "https://github.com/umijs/umi-next/tree/master/packages/bundler-webpack#readme",
-  "bugs": "https://github.com/umijs/umi-next/issues",
+  "homepage": "https://github.com/umijs/umi/tree/master/packages/bundler-webpack#readme",
+  "bugs": "https://github.com/umijs/umi/issues",
   "repository": {
     "type": "git",
-    "url": "https://github.com/umijs/umi-next"
+    "url": "https://github.com/umijs/umi"
   },
   "license": "MIT",
   "main": "dist/index.js",
@@ -24,7 +24,7 @@
     "build": "pnpm tsc",
     "build:client": "pnpm tsc --project ./tsconfig.client.json",
     "build:deps": "umi-scripts bundleDeps",
-    "dev": "pnpm build -- --watch",
+    "dev": "pnpm build --watch",
     "generate:webpackPackages": "zx ./scripts/generateWebpackPackages.mjs",
     "test": "umi-scripts jest-turbo"
   },
@@ -35,10 +35,10 @@
     "@svgr/plugin-jsx": "^6.2.1",
     "@svgr/plugin-svgo": "^6.2.0",
     "@types/hapi__joi": "17.1.8",
-    "@umijs/babel-preset-umi": "4.0.0-canary.20220615.2",
-    "@umijs/bundler-utils": "4.0.0-canary.20220615.2",
-    "@umijs/mfsu": "4.0.0-canary.20220615.2",
-    "@umijs/utils": "4.0.0-canary.20220615.2",
+    "@umijs/babel-preset-umi": "4.0.0-canary.20220628.1",
+    "@umijs/bundler-utils": "4.0.0-canary.20220628.1",
+    "@umijs/mfsu": "4.0.0-canary.20220628.1",
+    "@umijs/utils": "4.0.0-canary.20220628.1",
     "cors": "^2.8.5",
     "css-loader": "6.7.1",
     "es5-imcompatible-versions": "^0.1.73",