@modern-js/builder 2.22.0 → 2.22.1

package/CHANGELOG.md

@@ -1,5 +1,35 @@
 # @modern-js/builder
 
+## 2.22.1
+
+### Patch Changes
+
+- a470c04: chore(builder): reuse rem plugin between rspack and webpack provider
+
+  chore(builder): 在 rspack 和 webpack provider 间复用 rem 插件
+
+- bd4b150: feat(builder): add builder.serve method
+
+  feat(builder): 新增 builder.serve 方法
+
+- d4045ed: fix(builder): print https URLs when devServer.https is true
+
+  fix(builder): 当 devServer.https 为 true 时，输出 https 的 URLs
+
+- Updated dependencies [e2848a2]
+- Updated dependencies [a470c04]
+- Updated dependencies [95ffa6b]
+- Updated dependencies [12d54ae]
+- Updated dependencies [bd4b150]
+- Updated dependencies [dd36311]
+- Updated dependencies [d4045ed]
+- Updated dependencies [8bd9981]
+- Updated dependencies [1f02cd2]
+- Updated dependencies [cfcf003]
+- Updated dependencies [15181be]
+  - @modern-js/utils@2.22.1
+  - @modern-js/builder-shared@2.22.1
+
 ## 2.22.0
 
 ### Patch Changes

package/dist/createBuilder.js

@@ -6,7 +6,7 @@ const plugins_1 = require("./plugins");
 async function createBuilder(provider, options) {
     const builderOptions = (0, builder_shared_1.applyDefaultBuilderOptions)(options);
     const pluginStore = (0, builder_shared_1.createPluginStore)();
-    const { build, pluginAPI, publicContext, initConfigs, inspectConfig, createCompiler, startDevServer, applyDefaultPlugins, } = await provider({
+    const { build, serve, pluginAPI, publicContext, initConfigs, inspectConfig, createCompiler, startDevServer, applyDefaultPlugins, } = await provider({
         pluginStore,
         builderOptions,
         plugins: plugins_1.plugins,
@@ -29,6 +29,7 @@ async function createBuilder(provider, options) {
             'getBuilderConfig',
             'getNormalizedConfig',
         ]),
+        serve,
         build,
         createCompiler,
         initConfigs,

package/dist/plugins/html.js

@@ -206,15 +206,17 @@ const builderPluginHtml = () => ({
                 }
             }
         });
-        api.onBeforeStartDevServer(async () => {
+        const emitRouteJson = async () => {
             const { fs, ROUTE_SPEC_FILE } = await Promise.resolve().then(() => __importStar(require('@modern-js/utils')));
             const routeFilePath = path_1.default.join(api.context.distPath, ROUTE_SPEC_FILE);
-            // generate a basic route.json for modern.js dev server
+            // generate a basic route.json for modern.js server
             // if the framework has already generate a route.json, do nothing
             if (!(await (0, builder_shared_1.isFileExists)(routeFilePath)) && routesInfo.length) {
                 await fs.outputFile(routeFilePath, JSON.stringify({ routes: routesInfo }, null, 2));
             }
-        });
+        };
+        api.onBeforeBuild(emitRouteJson);
+        api.onBeforeStartDevServer(emitRouteJson);
         (0, exports.applyInjectTags)(api);
     },
 });

package/dist/plugins/index.js

@@ -48,4 +48,5 @@ exports.plugins = {
     arco: () => Promise.resolve().then(() => __importStar(require('./arco'))).then(m => m.builderPluginArco()),
     tsChecker: () => Promise.resolve().then(() => __importStar(require('./tsChecker'))).then(m => m.builderPluginTsChecker()),
     checkSyntax: () => Promise.resolve().then(() => __importStar(require('./checkSyntax'))).then(m => m.builderPluginCheckSyntax()),
+    rem: () => Promise.resolve().then(() => __importStar(require('./rem'))).then(m => m.builderPluginRem()),
 };

package/dist/plugins/rem.d.ts

@@ -0,0 +1,2 @@
+import { type DefaultBuilderPlugin } from '@modern-js/builder-shared';
+export declare const builderPluginRem: () => DefaultBuilderPlugin;

package/dist/plugins/rem.js

@@ -0,0 +1,106 @@
+"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 });
+exports.builderPluginRem = void 0;
+const lodash_1 = __importDefault(require("@modern-js/utils/lodash"));
+const builder_shared_1 = require("@modern-js/builder-shared");
+const defaultOptions = {
+    enableRuntime: true,
+    rootFontSize: 50,
+};
+const builderPluginRem = () => ({
+    name: 'builder-plugin-rem',
+    pre: [
+        'builder-plugin-css',
+        'builder-plugin-less',
+        'builder-plugin-sass',
+        'builder-plugin-stylus',
+    ],
+    setup(api) {
+        api.modifyBundlerChain(async (chain, { CHAIN_ID, isServer, isWebWorker, HtmlPlugin }) => {
+            const config = api.getNormalizedConfig();
+            const { output: { convertToRem }, } = config;
+            if (!convertToRem || isServer || isWebWorker) {
+                return;
+            }
+            const userOptions = {
+                ...defaultOptions,
+                ...(typeof convertToRem === 'boolean' ? {} : convertToRem),
+            };
+            // handle css
+            const { default: PxToRemPlugin } = (await Promise.resolve(`${(0, builder_shared_1.getSharedPkgCompiledPath)('postcss-pxtorem')}`).then(s => __importStar(require(s))));
+            const applyRules = [
+                CHAIN_ID.RULE.CSS,
+                CHAIN_ID.RULE.LESS,
+                CHAIN_ID.RULE.SASS,
+                CHAIN_ID.RULE.STYLUS,
+            ];
+            const getPxToRemPlugin = () => PxToRemPlugin({
+                rootValue: userOptions.rootFontSize,
+                unitPrecision: 5,
+                propList: ['*'],
+                ...lodash_1.default.cloneDeep(userOptions.pxtorem || {}),
+            });
+            // Deep copy options to prevent unexpected behavior.
+            applyRules.forEach(name => {
+                chain.module.rules.has(name) &&
+                    chain.module
+                        .rule(name)
+                        .use(CHAIN_ID.USE.POSTCSS)
+                        .tap((options = {}) => {
+                        var _a;
+                        return ({
+                            ...options,
+                            postcssOptions: {
+                                ...(options.postcssOptions || {}),
+                                plugins: [
+                                    ...(((_a = options.postcssOptions) === null || _a === void 0 ? void 0 : _a.plugins) || []),
+                                    getPxToRemPlugin(),
+                                ],
+                            },
+                        });
+                    });
+            });
+            // handle runtime (html)
+            if (!userOptions.enableRuntime) {
+                return;
+            }
+            const entries = Object.keys(chain.entryPoints.entries() || {});
+            const distDir = (0, builder_shared_1.getDistPath)(config.output, 'js');
+            chain
+                .plugin(CHAIN_ID.PLUGIN.AUTO_SET_ROOT_SIZE)
+                .use(builder_shared_1.AutoSetRootFontSizePlugin, [
+                userOptions,
+                entries,
+                HtmlPlugin,
+                distDir,
+            ]);
+        });
+    },
+});
+exports.builderPluginRem = builderPluginRem;

package/dist/plugins/startUrl.js

@@ -44,7 +44,8 @@ function builderPluginStartUrl() {
                     return;
                 }
                 const config = api.getNormalizedConfig();
-                const { https, startUrl, beforeStartUrl } = config.dev;
+                const { startUrl, beforeStartUrl } = config.dev;
+                const { https } = api.context.devServer || {};
                 if (!startUrl) {
                     return;
                 }

package/package.json

@@ -18,7 +18,7 @@
   "engines": {
     "node": ">=14.0.0"
   },
-  "version": "2.22.0",
+  "version": "2.22.1",
   "jsnext:source": "./src/index.ts",
   "types": "./dist/index.d.ts",
   "main": "./dist/index.js",
@@ -31,14 +31,14 @@
   },
   "dependencies": {
     "@svgr/webpack": "8.0.1",
-    "@modern-js/builder-shared": "2.22.0",
-    "@modern-js/utils": "2.22.0"
+    "@modern-js/builder-shared": "2.22.1",
+    "@modern-js/utils": "2.22.1"
   },
   "devDependencies": {
     "@types/babel__core": "^7.20.0",
     "@types/node": "^14",
     "typescript": "^5",
-    "@scripts/vitest-config": "2.22.0"
+    "@scripts/vitest-config": "2.22.1"
   },
   "publishConfig": {
     "registry": "https://registry.npmjs.org/",