diff --git a/packages/plugin-vue/package.json b/packages/plugin-vue/package.json index 0452244d06..c6ca550c6d 100644 --- a/packages/plugin-vue/package.json +++ b/packages/plugin-vue/package.json @@ -20,7 +20,8 @@ "main": "./dist/index.cjs", "types": "./dist/index.d.ts", "files": [ - "dist" + "dist", + "compiled" ], "scripts": { "build": "rslib build", @@ -28,8 +29,10 @@ "bump": "pnpx bumpp --no-tag" }, "dependencies": { - "vue-loader": "^17.4.2", - "webpack": "^5.102.1" + "chalk": "^4.1.0", + "hash-sum": "^2.0.0", + "webpack": "^5.102.1", + "watchpack": "^2.4.0" }, "devDependencies": { "@rsbuild/core": "workspace:*", @@ -37,11 +40,20 @@ "@scripts/test-helper": "workspace:*", "@types/node": "^22.18.11", "typescript": "^5.9.3", - "vue": "^3.5.22" + "vue": "^3.5.22", + "vue-loader": "^17.4.2" }, "peerDependencies": { "@rsbuild/core": "1.x" }, + "peerDependenciesMeta": { + "@vue/compiler-sfc": { + "optional": true + }, + "vue": { + "optional": true + } + }, "publishConfig": { "access": "public", "registry": "https://registry.npmjs.org/" diff --git a/packages/plugin-vue/rslib.config.ts b/packages/plugin-vue/rslib.config.ts index dd0e008e6e..fc9baf9b0f 100644 --- a/packages/plugin-vue/rslib.config.ts +++ b/packages/plugin-vue/rslib.config.ts @@ -1,3 +1,54 @@ +import fs from 'node:fs'; +import path from 'node:path'; import { dualPackage } from '@rsbuild/config/rslib.config.ts'; +import { defineConfig, rsbuild } from '@rslib/core'; -export default dualPackage; +const pluginTrimVueLoaderPackageJson: rsbuild.RsbuildPlugin = { + name: 'trim-vue-loader-package-json', + setup(api) { + api.onBeforeBuild(() => { + const cwd = process.cwd(); + const sourceRoot = path.join(cwd, 'node_modules/vue-loader'); + const targetRoot = path.join(cwd, 'compiled/vue-loader'); + + fs.rmSync(targetRoot, { recursive: true, force: true }); + + fs.cpSync(path.join(sourceRoot, 'dist'), path.join(targetRoot, 'dist'), { + recursive: true, + }); + + for (const file of ['package.json', 'LICENSE']) { + fs.copyFileSync( + path.join(sourceRoot, file), + path.join(targetRoot, file), + ); + } + }); + + api.onAfterBuild(() => { + const pkgPath = path.join( + process.cwd(), + 'compiled/vue-loader/package.json', + ); + const pkgJson = JSON.parse(fs.readFileSync(pkgPath, 'utf8')); + const fields = ['name', 'author', 'version', 'funding', 'license']; + const trimmed = Object.fromEntries( + fields + .filter((field) => field in pkgJson) + .map((field) => [field, pkgJson[field]]), + ); + fs.writeFileSync( + pkgPath, + `${JSON.stringify(trimmed, null, 2)}\n`, + 'utf8', + ); + }); + }, +}; + +export default defineConfig( + rsbuild.mergeRsbuildConfig(dualPackage, { + lib: [], + plugins: [pluginTrimVueLoaderPackageJson], + }), +); diff --git a/packages/plugin-vue/src/index.ts b/packages/plugin-vue/src/index.ts index f3d3d5c6d7..3a08c6cea5 100644 --- a/packages/plugin-vue/src/index.ts +++ b/packages/plugin-vue/src/index.ts @@ -1,6 +1,9 @@ import { createRequire } from 'node:module'; import type { EnvironmentConfig, RsbuildPlugin } from '@rsbuild/core'; -import { type VueLoaderOptions, VueLoaderPlugin } from 'vue-loader'; +import { + type VueLoaderOptions, + VueLoaderPlugin, +} from '../compiled/vue-loader/dist/index.js'; import { applySplitChunksRule } from './splitChunks.js'; const require = createRequire(import.meta.url); @@ -90,7 +93,7 @@ export function pluginVue(options: PluginVueOptions = {}): RsbuildPlugin { .rule(CHAIN_ID.RULE.VUE) .test(VUE_REGEXP) .use(CHAIN_ID.USE.VUE) - .loader(require.resolve('vue-loader')) + .loader(require.resolve('../compiled/vue-loader/dist/index.js')) .options(vueLoaderOptions); // Support for lang="postcss" and lang="pcss" in SFC diff --git a/packages/plugin-vue/tests/__snapshots__/index.test.ts.snap b/packages/plugin-vue/tests/__snapshots__/index.test.ts.snap index 8efc3660ac..cc8bd84c59 100644 --- a/packages/plugin-vue/tests/__snapshots__/index.test.ts.snap +++ b/packages/plugin-vue/tests/__snapshots__/index.test.ts.snap @@ -5,7 +5,7 @@ exports[`plugin-vue > should add vue-loader and VueLoaderPlugin correctly 1`] = "test": /\\\\\\.vue\\$/, "use": [ { - "loader": "/node_modules//vue-loader/dist/index.js", + "loader": "/packages/plugin-vue/compiled/vue-loader/dist/index.js", "options": { "compilerOptions": { "preserveWhitespace": false, @@ -41,7 +41,7 @@ exports[`plugin-vue > should allow to configure vueLoader options 1`] = ` "test": /\\\\\\.vue\\$/, "use": [ { - "loader": "/node_modules//vue-loader/dist/index.js", + "loader": "/packages/plugin-vue/compiled/vue-loader/dist/index.js", "options": { "compilerOptions": { "preserveWhitespace": false, diff --git a/packages/plugin-vue/tsconfig.json b/packages/plugin-vue/tsconfig.json index f95a65267f..41f910852e 100644 --- a/packages/plugin-vue/tsconfig.json +++ b/packages/plugin-vue/tsconfig.json @@ -11,5 +11,5 @@ "path": "../core" } ], - "include": ["src"] + "include": ["src", "compiled"] } diff --git a/patches/vue-loader.patch b/patches/vue-loader.patch new file mode 100644 index 0000000000..114aa6ab9d --- /dev/null +++ b/patches/vue-loader.patch @@ -0,0 +1,12 @@ +diff --git a/dist/pluginWebpack5.js b/dist/pluginWebpack5.js +index 7c5eadf2ad45157aed2fd23a83ae4b1a2fb4b8ac..b9cd4eb701c366fa7f7f4782a20d4e3568705a94 100644 +--- a/dist/pluginWebpack5.js ++++ b/dist/pluginWebpack5.js +@@ -61,6 +61,7 @@ const ruleSetCompiler = new RuleSetCompiler([ + new BasicEffectRulePlugin('resolve'), + new BasicEffectRulePlugin('generator'), + new BasicEffectRulePlugin('layer'), ++ new BasicEffectRulePlugin('with'), + new UseEffectRulePlugin(), + ]); + class VueLoaderPlugin { diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 9d17692a0a..7c9c69119f 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -20,6 +20,9 @@ patchedDependencies: url-loader: hash: 4ed67f741914e665ed1dcef907caaa2acc85269026674133f7b987661de3591f path: patches/url-loader@4.1.1.patch + vue-loader: + hash: 394a6ca6e0d17901c66d15711435ff35aa5bdfad4dad685686431eb1b24d3c6c + path: patches/vue-loader.patch importers: @@ -1118,9 +1121,15 @@ importers: packages/plugin-vue: dependencies: - vue-loader: - specifier: ^17.4.2 - version: 17.4.2(vue@3.5.22(typescript@5.9.3))(webpack@5.102.1) + chalk: + specifier: ^4.1.0 + version: 4.1.2 + hash-sum: + specifier: ^2.0.0 + version: 2.0.0 + watchpack: + specifier: ^2.4.0 + version: 2.4.4 webpack: specifier: ^5.102.1 version: 5.102.1 @@ -1143,6 +1152,9 @@ importers: vue: specifier: ^3.5.22 version: 3.5.22(typescript@5.9.3) + vue-loader: + specifier: ^17.4.2 + version: 17.4.2(patch_hash=394a6ca6e0d17901c66d15711435ff35aa5bdfad4dad685686431eb1b24d3c6c)(vue@3.5.22(typescript@5.9.3))(webpack@5.102.1) scripts/config: devDependencies: @@ -12966,7 +12978,7 @@ snapshots: '@types/unist': 3.0.3 vfile-message: 4.0.2 - vue-loader@17.4.2(vue@3.5.22(typescript@5.9.3))(webpack@5.102.1): + vue-loader@17.4.2(patch_hash=394a6ca6e0d17901c66d15711435ff35aa5bdfad4dad685686431eb1b24d3c6c)(vue@3.5.22(typescript@5.9.3))(webpack@5.102.1): dependencies: chalk: 4.1.2 hash-sum: 2.0.0 diff --git a/pnpm-workspace.yaml b/pnpm-workspace.yaml index c2bf103dfa..265042b8b3 100644 --- a/pnpm-workspace.yaml +++ b/pnpm-workspace.yaml @@ -10,6 +10,8 @@ packages: - '!**/create-rsbuild/template-*/**' - '!**/test-temp-*/**' +engineStrict: true + hoistPattern: [] patchedDependencies: @@ -18,6 +20,6 @@ patchedDependencies: http-proxy@1.18.1: patches/http-proxy@1.18.1.patch postcss-loader@8.2.0: patches/postcss-loader@8.2.0.patch url-loader: patches/url-loader@4.1.1.patch + vue-loader: patches/vue-loader.patch strictPeerDependencies: false -engineStrict: true diff --git a/rstest.config.ts b/rstest.config.ts index 0e896284c9..bfa170ff0f 100644 --- a/rstest.config.ts +++ b/rstest.config.ts @@ -13,7 +13,7 @@ export default defineConfig({ alias, }, output: { - externals: ['@rsbuild/core'], + externals: ['@rsbuild/core', /\/compiled\/vue-loader/], }, name: 'node', globals: true,