@rsbuild/plugin-vue2 0.0.0-next-20240528072128 → 0.0.0-next-20240723074951

package/dist/VueLoader15PitchFixPlugin.d.ts

@@ -0,0 +1,8 @@
+import type { Rspack } from '@rsbuild/core';
+/**
+ * this plugin is a quick fix for issue https://github.com/web-infra-dev/rsbuild/issues/2093
+ */
+export declare class VueLoader15PitchFixPlugin implements Rspack.RspackPluginInstance {
+    readonly name = "VueLoader15PitchFixPlugin";
+    apply(compiler: Rspack.Compiler): void;
+}

package/dist/index.cjs

@@ -35,6 +35,7 @@ var __publicField = (obj, key, value) => {
 // src/index.ts
 var src_exports = {};
 __export(src_exports, {
+  PLUGIN_VUE2_NAME: () => PLUGIN_VUE2_NAME,
   pluginVue2: () => pluginVue2
 });
 module.exports = __toCommonJS(src_exports);
@@ -80,52 +81,59 @@ var VueLoader15PitchFixPlugin = class {
 };
 
 // src/splitChunks.ts
-var import_shared = require("@rsbuild/shared");
+var isPlainObject = (obj) => obj !== null && typeof obj === "object" && Object.prototype.toString.call(obj) === "[object Object]";
 var applySplitChunksRule = (api, options = {
   vue: true,
   router: true
 }) => {
-  api.modifyBundlerChain((chain) => {
-    const config = api.getNormalizedConfig();
+  api.modifyBundlerChain((chain, { environment }) => {
+    const { config } = environment;
     if (config.performance.chunkSplit.strategy !== "split-by-experience") {
       return;
     }
     const currentConfig = chain.optimization.splitChunks.values();
-    if (!(0, import_shared.isPlainObject)(currentConfig)) {
+    if (!isPlainObject(currentConfig)) {
       return;
     }
     const extraGroups = {};
-    if (options.vue) {
-      extraGroups.vue = ["vue", "vue-loader"];
+    if (options.router) {
+      extraGroups.vue = {
+        name: "lib-vue",
+        test: /node_modules[\\/](?:vue|vue-loader)[\\/]/,
+        priority: 0
+      };
     }
     if (options.router) {
-      extraGroups.router = ["vue-router"];
+      extraGroups.router = {
+        name: "lib-router",
+        test: /node_modules[\\/]vue-router[\\/]/,
+        priority: 0
+      };
     }
     if (!Object.keys(extraGroups).length) {
       return;
     }
     chain.optimization.splitChunks({
       ...currentConfig,
-      // @ts-expect-error Rspack and Webpack uses different cacheGroups type
       cacheGroups: {
         ...currentConfig.cacheGroups,
-        ...(0, import_shared.createCacheGroups)(extraGroups)
+        ...extraGroups
       }
     });
   });
 };
 
 // src/index.ts
+var PLUGIN_VUE2_NAME = "rsbuild:vue2";
 function pluginVue2(options = {}) {
   return {
-    name: "rsbuild:vue2",
+    name: PLUGIN_VUE2_NAME,
     setup(api) {
       const VUE_REGEXP = /\.vue$/;
       const CSS_MODULES_REGEX = /\.modules?\.\w+$/i;
       api.modifyRsbuildConfig((config) => {
-        var _a;
-        config.output || (config.output = {});
-        (_a = config.output).cssModules || (_a.cssModules = {});
+        config.output ||= {};
+        config.output.cssModules ||= {};
         if (config.output.cssModules.auto === true) {
           config.output.cssModules.auto = (path, query) => {
             if (VUE_REGEXP.test(path)) {
@@ -143,7 +151,8 @@ function pluginVue2(options = {}) {
         }
         const userLoaderOptions = options.vueLoaderOptions ?? {};
         const compilerOptions = {
-          preserveWhitespace: false,
+          // https://github.com/vuejs/vue-cli/pull/3853
+          whitespace: "condense",
           ...userLoaderOptions.compilerOptions
         };
         const vueLoaderOptions = {
@@ -151,16 +160,31 @@ function pluginVue2(options = {}) {
           ...userLoaderOptions,
           compilerOptions
         };
-        chain.module.rule(CHAIN_ID.RULE.VUE).test(VUE_REGEXP).use(CHAIN_ID.USE.VUE).loader(require.resolve("vue-loader")).options(vueLoaderOptions);
+        const rule = chain.module.rule(CHAIN_ID.RULE.VUE);
+        rule.test(VUE_REGEXP).use(CHAIN_ID.USE.VUE).loader(require.resolve("vue-loader")).options(vueLoaderOptions);
+        if (chain.module.rules.has(CHAIN_ID.RULE.JS)) {
+          applyResolveConfig(rule, chain.module.rule(CHAIN_ID.RULE.JS));
+        }
         chain.module.rule(CHAIN_ID.RULE.CSS).test(/\.(?:css|postcss|pcss)$/);
         chain.plugin(CHAIN_ID.PLUGIN.VUE_LOADER_PLUGIN).use(import_vue_loader.VueLoaderPlugin);
-        chain.plugin(CHAIN_ID.PLUGIN.VUE_LOADER_15_PITCH_FIX_PLUGIN).use(VueLoader15PitchFixPlugin);
+        chain.plugin("vue-loader-15-pitch-fix").use(VueLoader15PitchFixPlugin);
       });
       applySplitChunksRule(api, options.splitChunks);
     }
   };
 }
+function applyResolveConfig(vueRule, jsRule) {
+  const fullySpecified = jsRule.resolve.get("fullySpecified");
+  const aliases = jsRule.resolve.alias.entries();
+  if (aliases) {
+    vueRule.resolve.alias.merge(aliases);
+  }
+  if (fullySpecified !== void 0) {
+    vueRule.resolve.fullySpecified(fullySpecified);
+  }
+}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  PLUGIN_VUE2_NAME,
   pluginVue2
 });

package/dist/index.d.ts

@@ -1,7 +1,6 @@
-import { RsbuildPlugin } from '@rsbuild/core';
-import { VueLoaderOptions } from 'vue-loader';
-
-type SplitVueChunkOptions = {
+import type { RsbuildPlugin } from '@rsbuild/core';
+import { type VueLoaderOptions } from 'vue-loader';
+export type SplitVueChunkOptions = {
     /**
      * Whether to enable split chunking for Vue-related dependencies (e.g., vue, vue-loader).
      * @default true
@@ -13,7 +12,7 @@ type SplitVueChunkOptions = {
      */
     router?: boolean;
 };
-type PluginVueOptions = {
+export type PluginVueOptions = {
     /**
      * Options passed to `vue-loader`.
      * @see https://vue-loader.vuejs.org/
@@ -24,6 +23,5 @@ type PluginVueOptions = {
      */
     splitChunks?: SplitVueChunkOptions;
 };
-declare function pluginVue2(options?: PluginVueOptions): RsbuildPlugin;
-
-export { type PluginVueOptions, type SplitVueChunkOptions, pluginVue2 };
+export declare const PLUGIN_VUE2_NAME = "rsbuild:vue2";
+export declare function pluginVue2(options?: PluginVueOptions): RsbuildPlugin;

package/dist/index.js

@@ -15,7 +15,7 @@ var __publicField = (obj, key, value) => {
   return value;
 };
 
-// ../../node_modules/.pnpm/@modern-js+module-tools@2.50.0_eslint@9.3.0_typescript@5.4.5/node_modules/@modern-js/module-tools/shims/esm.js
+// ../../node_modules/.pnpm/@modern-js+module-tools@2.56.0_typescript@5.5.2/node_modules/@modern-js/module-tools/shims/esm.js
 import { fileURLToPath } from "url";
 import path from "path";
 
@@ -62,13 +62,13 @@ var VueLoader15PitchFixPlugin = class {
 };
 
 // src/splitChunks.ts
-import { createCacheGroups, isPlainObject } from "@rsbuild/shared";
+var isPlainObject = (obj) => obj !== null && typeof obj === "object" && Object.prototype.toString.call(obj) === "[object Object]";
 var applySplitChunksRule = (api, options = {
   vue: true,
   router: true
 }) => {
-  api.modifyBundlerChain((chain) => {
-    const config = api.getNormalizedConfig();
+  api.modifyBundlerChain((chain, { environment }) => {
+    const { config } = environment;
     if (config.performance.chunkSplit.strategy !== "split-by-experience") {
       return;
     }
@@ -77,37 +77,44 @@ var applySplitChunksRule = (api, options = {
       return;
     }
     const extraGroups = {};
-    if (options.vue) {
-      extraGroups.vue = ["vue", "vue-loader"];
+    if (options.router) {
+      extraGroups.vue = {
+        name: "lib-vue",
+        test: /node_modules[\\/](?:vue|vue-loader)[\\/]/,
+        priority: 0
+      };
     }
     if (options.router) {
-      extraGroups.router = ["vue-router"];
+      extraGroups.router = {
+        name: "lib-router",
+        test: /node_modules[\\/]vue-router[\\/]/,
+        priority: 0
+      };
     }
     if (!Object.keys(extraGroups).length) {
       return;
     }
     chain.optimization.splitChunks({
       ...currentConfig,
-      // @ts-expect-error Rspack and Webpack uses different cacheGroups type
       cacheGroups: {
         ...currentConfig.cacheGroups,
-        ...createCacheGroups(extraGroups)
+        ...extraGroups
       }
     });
   });
 };
 
 // src/index.ts
+var PLUGIN_VUE2_NAME = "rsbuild:vue2";
 function pluginVue2(options = {}) {
   return {
-    name: "rsbuild:vue2",
+    name: PLUGIN_VUE2_NAME,
     setup(api) {
       const VUE_REGEXP = /\.vue$/;
       const CSS_MODULES_REGEX = /\.modules?\.\w+$/i;
       api.modifyRsbuildConfig((config) => {
-        var _a;
-        config.output || (config.output = {});
-        (_a = config.output).cssModules || (_a.cssModules = {});
+        config.output ||= {};
+        config.output.cssModules ||= {};
         if (config.output.cssModules.auto === true) {
           config.output.cssModules.auto = (path2, query) => {
             if (VUE_REGEXP.test(path2)) {
@@ -125,7 +132,8 @@ function pluginVue2(options = {}) {
         }
         const userLoaderOptions = options.vueLoaderOptions ?? {};
         const compilerOptions = {
-          preserveWhitespace: false,
+          // https://github.com/vuejs/vue-cli/pull/3853
+          whitespace: "condense",
           ...userLoaderOptions.compilerOptions
         };
         const vueLoaderOptions = {
@@ -133,15 +141,30 @@ function pluginVue2(options = {}) {
           ...userLoaderOptions,
           compilerOptions
         };
-        chain.module.rule(CHAIN_ID.RULE.VUE).test(VUE_REGEXP).use(CHAIN_ID.USE.VUE).loader(__require.resolve("vue-loader")).options(vueLoaderOptions);
+        const rule = chain.module.rule(CHAIN_ID.RULE.VUE);
+        rule.test(VUE_REGEXP).use(CHAIN_ID.USE.VUE).loader(__require.resolve("vue-loader")).options(vueLoaderOptions);
+        if (chain.module.rules.has(CHAIN_ID.RULE.JS)) {
+          applyResolveConfig(rule, chain.module.rule(CHAIN_ID.RULE.JS));
+        }
         chain.module.rule(CHAIN_ID.RULE.CSS).test(/\.(?:css|postcss|pcss)$/);
         chain.plugin(CHAIN_ID.PLUGIN.VUE_LOADER_PLUGIN).use(VueLoaderPlugin);
-        chain.plugin(CHAIN_ID.PLUGIN.VUE_LOADER_15_PITCH_FIX_PLUGIN).use(VueLoader15PitchFixPlugin);
+        chain.plugin("vue-loader-15-pitch-fix").use(VueLoader15PitchFixPlugin);
       });
       applySplitChunksRule(api, options.splitChunks);
     }
   };
 }
+function applyResolveConfig(vueRule, jsRule) {
+  const fullySpecified = jsRule.resolve.get("fullySpecified");
+  const aliases = jsRule.resolve.alias.entries();
+  if (aliases) {
+    vueRule.resolve.alias.merge(aliases);
+  }
+  if (fullySpecified !== void 0) {
+    vueRule.resolve.fullySpecified(fullySpecified);
+  }
+}
 export {
+  PLUGIN_VUE2_NAME,
   pluginVue2
 };

package/dist/splitChunks.d.ts

@@ -0,0 +1,3 @@
+import type { RsbuildPluginAPI } from '@rsbuild/core';
+import type { SplitVueChunkOptions } from '.';
+export declare const applySplitChunksRule: (api: RsbuildPluginAPI, options?: SplitVueChunkOptions) => void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rsbuild/plugin-vue2",
-  "version": "0.0.0-next-20240528072128",
+  "version": "0.0.0-next-20240723074951",
   "description": "Vue 2 plugin of Rsbuild",
   "homepage": "https://rsbuild.dev",
   "repository": {
@@ -24,17 +24,16 @@
   ],
   "dependencies": {
     "vue-loader": "^15.11.1",
-    "webpack": "^5.91.0",
-    "@rsbuild/shared": "0.0.0-next-20240528072128"
+    "webpack": "^5.93.0"
   },
   "devDependencies": {
-    "typescript": "^5.4.2",
-    "webpack": "^5.91.0",
-    "@rsbuild/core": "0.0.0-next-20240528072128",
-    "@scripts/test-helper": "0.0.0-next-20240528072128"
+    "typescript": "^5.5.2",
+    "webpack": "^5.93.0",
+    "@rsbuild/core": "0.0.0-next-20240723074951",
+    "@scripts/test-helper": "0.0.0-next-20240723074951"
   },
   "peerDependencies": {
-    "@rsbuild/core": "0.0.0-next-20240528072128"
+    "@rsbuild/core": "0.0.0-next-20240723074951"
   },
   "publishConfig": {
     "access": "public",