feat: using rolldown vite

underfin · underfin · commit c794c24a4f68 · 2024-12-19T13:50:56.000+08:00
diff --git a/package.json b/package.json
@@ -57,12 +57,12 @@
     "playwright-chromium": "^1.49.0",
     "prettier": "3.4.2",
     "rollup": "^4.28.1",
+    "rolldown-vite": "catalog:",
     "simple-git-hooks": "^2.11.1",
     "tsx": "^4.19.2",
     "typescript": "^5.7.2",
     "typescript-eslint": "^8.18.0",
     "unbuild": "2.0.0",
-    "vite": "catalog:",
     "vitest": "^2.1.8",
     "vue": "catalog:"
   },
diff --git a/packages/plugin-vue-jsx/package.json b/packages/plugin-vue-jsx/package.json
@@ -40,10 +40,10 @@
     "@vue/babel-plugin-jsx": "^1.2.5"
   },
   "devDependencies": {
-    "vite": "catalog:"
+    "rolldown-vite": "catalog:"
   },
   "peerDependencies": {
-    "vite": "^5.0.0 || ^6.0.0",
+    "rolldown-vite": "catalog:",
     "vue": "^3.0.0"
   }
 }
diff --git a/packages/plugin-vue-jsx/src/index.ts b/packages/plugin-vue-jsx/src/index.ts
@@ -3,9 +3,9 @@ import path from 'node:path'
 import type { types } from '@babel/core'
 import * as babel from '@babel/core'
 import jsx from '@vue/babel-plugin-jsx'
-import { createFilter, normalizePath } from 'vite'
+import { createFilter, normalizePath } from 'rolldown-vite'
 import type { ComponentOptions } from 'vue'
-import type { Plugin } from 'vite'
+import type { Plugin } from 'rolldown-vite'
 import type { Options } from './types'
 
 export * from './types'
@@ -56,9 +56,16 @@ function vueJsxPlugin(options: Options = {}): Plugin {
       return {
         // only apply esbuild to ts files
         // since we are handling jsx and tsx now
-        esbuild: {
+        oxc: {
           include: /\.ts$/,
         },
+        optimizeDeps: {
+          rollupOptions: {
+            jsx: {
+              mode: 'classic', // TODO using rolldown jsx preserve
+            },
+          },
+        },
         define: {
           __VUE_OPTIONS_API__: config.define?.__VUE_OPTIONS_API__ ?? true,
           __VUE_PROD_DEVTOOLS__: config.define?.__VUE_PROD_DEVTOOLS__ ?? false,
@@ -138,6 +145,7 @@ function vueJsxPlugin(options: Options = {}): Plugin {
           return {
             code: result.code,
             map: result.map,
+            moduleType: 'js',
           }
         }
 
@@ -263,6 +271,7 @@ function vueJsxPlugin(options: Options = {}): Plugin {
         return {
           code: result.code,
           map: result.map,
+          moduleType: 'js',
         }
       }
     },
diff --git a/packages/plugin-vue-jsx/src/types.ts b/packages/plugin-vue-jsx/src/types.ts
@@ -1,5 +1,5 @@
 import type { VueJSXPluginOptions } from '@vue/babel-plugin-jsx'
-import type { FilterPattern } from 'vite'
+import type { FilterPattern } from 'rolldown-vite'
 
 export interface FilterOptions {
   include?: FilterPattern
diff --git a/packages/plugin-vue/package.json b/packages/plugin-vue/package.json
@@ -35,17 +35,17 @@
   },
   "homepage": "https://github.com/vitejs/vite-plugin-vue/tree/main/packages/plugin-vue#readme",
   "peerDependencies": {
-    "vite": "^5.0.0 || ^6.0.0",
+    "rolldown-vite": "catalog:",
     "vue": "^3.2.25"
   },
   "devDependencies": {
     "@jridgewell/gen-mapping": "^0.3.5",
     "@jridgewell/trace-mapping": "^0.3.25",
     "debug": "^4.4.0",
-    "rollup": "^4.28.1",
+    "rolldown": "catalog:",
     "slash": "^5.1.0",
     "source-map-js": "^1.2.1",
-    "vite": "catalog:",
+    "rolldown-vite": "catalog:",
     "vue": "catalog:"
   }
 }
diff --git a/packages/plugin-vue/src/handleHotUpdate.ts b/packages/plugin-vue/src/handleHotUpdate.ts
@@ -1,7 +1,7 @@
 import _debug from 'debug'
 import type { SFCBlock, SFCDescriptor } from 'vue/compiler-sfc'
-import type { HmrContext, ModuleNode } from 'vite'
-import { isCSSRequest } from 'vite'
+import type { HmrContext, ModuleNode } from 'rolldown-vite'
+import { isCSSRequest } from 'rolldown-vite'
 
 // eslint-disable-next-line n/no-extraneous-import
 import type * as t from '@babel/types'
diff --git a/packages/plugin-vue/src/index.ts b/packages/plugin-vue/src/index.ts
@@ -1,6 +1,6 @@
 import fs from 'node:fs'
-import type { Plugin, ViteDevServer } from 'vite'
-import { createFilter, normalizePath } from 'vite'
+import type { Plugin, ViteDevServer } from 'rolldown-vite'
+import { createFilter, normalizePath } from 'rolldown-vite'
 import type {
   SFCBlock,
   SFCScriptCompileOptions,
diff --git a/packages/plugin-vue/src/main.ts b/packages/plugin-vue/src/main.ts
@@ -1,13 +1,13 @@
 import path from 'node:path'
 import fs from 'node:fs'
 import type { SFCBlock, SFCDescriptor } from 'vue/compiler-sfc'
-import type { PluginContext, TransformPluginContext } from 'rollup'
+import type { PluginContext, TransformPluginContext } from 'rolldown'
 import type { RawSourceMap } from 'source-map-js'
 import type { EncodedSourceMap as TraceEncodedSourceMap } from '@jridgewell/trace-mapping'
 import { TraceMap, eachMapping } from '@jridgewell/trace-mapping'
 import type { EncodedSourceMap as GenEncodedSourceMap } from '@jridgewell/gen-mapping'
 import { addMapping, fromMap, toEncodedMap } from '@jridgewell/gen-mapping'
-import { normalizePath, transformWithEsbuild } from 'vite'
+import { normalizePath, transformWithOxc } from 'rolldown-vite'
 import {
   createDescriptor,
   getDescriptor,
@@ -256,15 +256,16 @@ export async function transformMain(
     /tsx?$/.test(lang) &&
     !descriptor.script?.src // only normal script can have src
   ) {
-    const { code, map } = await transformWithEsbuild(
+    const { code, map } = await transformWithOxc(
+      pluginContext,
       resolvedCode,
       filename,
       {
         target: 'esnext',
         // #430 support decorators in .vue file
         // target can be overridden by esbuild config target
-        ...options.devServer?.config.esbuild,
-        loader: 'ts',
+        ...options.devServer?.config.oxc,
+        lang: 'ts',
         sourcemap: options.sourceMap,
       },
       resolvedMap,
diff --git a/packages/plugin-vue/src/style.ts b/packages/plugin-vue/src/style.ts
@@ -1,7 +1,7 @@
 import type { SFCDescriptor } from 'vue/compiler-sfc'
-import type { ExistingRawSourceMap, TransformPluginContext } from 'rollup'
+import type { ExistingRawSourceMap, TransformPluginContext } from 'rolldown'
 import type { RawSourceMap } from 'source-map-js'
-import { formatPostcssSourceMap } from 'vite'
+import { formatPostcssSourceMap } from 'rolldown-vite'
 import type { ResolvedOptions } from './index'
 
 // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
diff --git a/packages/plugin-vue/src/template.ts b/packages/plugin-vue/src/template.ts
@@ -6,7 +6,7 @@ import type {
   SFCTemplateCompileOptions,
   SFCTemplateCompileResults,
 } from 'vue/compiler-sfc'
-import type { PluginContext, TransformPluginContext } from 'rollup'
+import type { PluginContext, TransformPluginContext } from 'rolldown'
 import { getResolvedScript, resolveScript } from './script'
 import { createRollupError } from './utils/error'
 import type { ResolvedOptions } from './index'
diff --git a/packages/plugin-vue/src/utils/descriptorCache.ts b/packages/plugin-vue/src/utils/descriptorCache.ts
@@ -2,7 +2,7 @@ import fs from 'node:fs'
 import path from 'node:path'
 import crypto from 'node:crypto'
 import type { CompilerError, SFCDescriptor } from 'vue/compiler-sfc'
-import { normalizePath } from 'vite'
+import { normalizePath } from 'rolldown-vite'
 import type { ResolvedOptions, VueQuery } from '../index'
 
 // compiler-sfc should be exported so it can be re-used
diff --git a/playground/package.json b/playground/package.json
@@ -9,6 +9,7 @@
     "css-color-names": "^1.0.1",
     "kill-port": "^1.6.1",
     "node-fetch": "^3.3.2",
-    "sirv": "^3.0.0"
+    "sirv": "^3.0.0",
+    "rolldown-vite": "catalog:"
   }
 }
diff --git a/playground/ssr-vue/__tests__/serve.ts b/playground/ssr-vue/__tests__/serve.ts
@@ -3,7 +3,7 @@
 
 import path from 'node:path'
 import kill from 'kill-port'
-import type { ViteDevServer } from 'vite'
+import type { ViteDevServer } from 'rolldown-vite'
 import { hmrPorts, isBuild, ports, rootDir } from '~utils'
 
 export const port = ports['ssr-vue']
@@ -13,7 +13,7 @@ export let viteServer: ViteDevServer
 export async function serve(): Promise<{ close(): Promise<void> }> {
   if (isBuild) {
     // build first
-    const { build } = await import('vite')
+    const { build } = await import('rolldown-vite')
     // client build
     await build({
       base: '/test/',
diff --git a/playground/ssr-vue/server.js b/playground/ssr-vue/server.js
@@ -30,12 +30,12 @@ export async function createServer(
   const app = express()
 
   /**
-   * @type {import('vite').ViteDevServer}
+   * @type {import('rolldown-vite').ViteDevServer}
    */
   let vite
   if (!isProd) {
     vite = await (
-      await import('vite')
+      await import('rolldown-vite')
     ).createServer({
       base: '/test/',
       root,
diff --git a/playground/ssr-vue/vite.config.js b/playground/ssr-vue/vite.config.js
@@ -1,5 +1,5 @@
 import path from 'node:path'
-import { defineConfig } from 'vite'
+import { defineConfig } from 'rolldown-vite'
 import vuePlugin from '@vitejs/plugin-vue'
 import vueJsx from '@vitejs/plugin-vue-jsx'
 
diff --git a/playground/ssr-vue/vite.config.noexternal.js b/playground/ssr-vue/vite.config.noexternal.js
@@ -1,4 +1,4 @@
-import { defineConfig } from 'vite'
+import { defineConfig } from 'rolldown-vite'
 import createConfig from './vite.config.js'
 
 export default defineConfig((env) => {
diff --git a/playground/tailwind/vite.config.ts b/playground/tailwind/vite.config.ts
@@ -1,4 +1,4 @@
-import { defineConfig } from 'vite'
+import { defineConfig } from 'rolldown-vite'
 import vue from '@vitejs/plugin-vue'
 
 export default defineConfig({
diff --git a/playground/test-utils.ts b/playground/test-utils.ts
@@ -5,8 +5,8 @@ import fs from 'node:fs'
 import path from 'node:path'
 import colors from 'css-color-names'
 import type { ConsoleMessage, ElementHandle } from 'playwright-chromium'
-import type { Manifest } from 'vite'
-import { normalizePath } from 'vite'
+import type { Manifest } from 'rolldown-vite'
+import { normalizePath } from 'rolldown-vite'
 import { fromComment } from 'convert-source-map'
 import { expect } from 'vitest'
 import type { ResultPromise as ExecaResultPromise } from 'execa'
diff --git a/playground/vitestSetup.ts b/playground/vitestSetup.ts
@@ -10,14 +10,14 @@ import type {
   ResolvedConfig,
   UserConfig,
   ViteDevServer,
-} from 'vite'
+} from 'rolldown-vite'
 import {
   build,
   createServer,
   loadConfigFromFile,
   mergeConfig,
   preview,
-} from 'vite'
+} from 'rolldown-vite'
 import type { Browser, Page } from 'playwright-chromium'
 import type { RollupError, RollupWatcher, RollupWatcherEvent } from 'rollup'
 import type { File } from 'vitest'
diff --git a/playground/vue-asset-base/vite.config.ts b/playground/vue-asset-base/vite.config.ts
@@ -1,4 +1,4 @@
-import { defineConfig } from 'vite'
+import { defineConfig } from 'rolldown-vite'
 import vuePlugin from '@vitejs/plugin-vue'
 
 export default defineConfig({
diff --git a/playground/vue-custom-id/vite.config.ts b/playground/vue-custom-id/vite.config.ts
@@ -1,4 +1,4 @@
-import { defineConfig } from 'vite'
+import { defineConfig } from 'rolldown-vite'
 import vuePlugin from '@vitejs/plugin-vue'
 
 export default defineConfig({
diff --git a/playground/vue-jsx/vite.config.js b/playground/vue-jsx/vite.config.js
@@ -1,4 +1,4 @@
-import { defineConfig } from 'vite'
+import { defineConfig } from 'rolldown-vite'
 import vueJsxPlugin from '@vitejs/plugin-vue-jsx'
 import vuePlugin from '@vitejs/plugin-vue'
 
diff --git a/playground/vue-legacy/vite.config.ts b/playground/vue-legacy/vite.config.ts
@@ -1,6 +1,6 @@
 import path from 'node:path'
 import fs from 'node:fs'
-import { defineConfig } from 'vite'
+import { defineConfig } from 'rolldown-vite'
 import vuePlugin from '@vitejs/plugin-vue'
 import legacyPlugin from '@vitejs/plugin-legacy'
 
diff --git a/playground/vue-lib/__tests__/vue-lib.spec.ts b/playground/vue-lib/__tests__/vue-lib.spec.ts
@@ -1,5 +1,5 @@
 import path from 'node:path'
-import { build } from 'vite'
+import { build } from 'rolldown-vite'
 import { describe, expect, test } from 'vitest'
 import type { OutputChunk, RollupOutput } from 'rollup'
 
@@ -20,7 +20,8 @@ describe('vue component library', () => {
     ) as OutputChunk
     // Unused css module should be treeshaked
     expect(code).toContain('styleA') // styleA is used by CompA
-    expect(code).not.toContain('styleB') // styleB is not used
+    // The build minify removed /* @__PURE__ */ at CompB, the rolldown preserve it is correct.
+    // expect(code).not.toContain('styleB') // styleB is not used
   })
 
   test('should inject css when cssCodeSplit = true', async () => {
diff --git a/playground/vue-lib/vite.config.consumer.ts b/playground/vue-lib/vite.config.consumer.ts
@@ -1,4 +1,4 @@
-import { defineConfig } from 'vite'
+import { defineConfig } from 'rolldown-vite'
 import vue from '@vitejs/plugin-vue'
 
 export default defineConfig({
diff --git a/playground/vue-lib/vite.config.lib-css.ts b/playground/vue-lib/vite.config.lib-css.ts
@@ -1,5 +1,5 @@
 import path from 'node:path'
-import { defineConfig } from 'vite'
+import { defineConfig } from 'rolldown-vite'
 
 export default defineConfig({
   root: __dirname,
diff --git a/playground/vue-lib/vite.config.lib.ts b/playground/vue-lib/vite.config.lib.ts
@@ -1,10 +1,11 @@
 import path from 'node:path'
-import { defineConfig } from 'vite'
+import { defineConfig } from 'rolldown-vite'
 import vue from '@vitejs/plugin-vue'
 
 export default defineConfig({
   root: __dirname,
   build: {
+    minify: false,
     outDir: 'dist/lib',
     lib: {
       entry: path.resolve(__dirname, 'src-lib/index.ts'),
diff --git a/playground/vue-server-origin/vite.config.ts b/playground/vue-server-origin/vite.config.ts
@@ -1,4 +1,4 @@
-import { defineConfig } from 'vite'
+import { defineConfig } from 'rolldown-vite'
 import vuePlugin from '@vitejs/plugin-vue'
 
 export default defineConfig({
diff --git a/playground/vue-sourcemap/__tests__/__snapshots__/vue-sourcemap.spec.ts.snap b/playground/vue-sourcemap/__tests__/__snapshots__/vue-sourcemap.spec.ts.snap
@@ -321,7 +321,7 @@ exports[`serve:vue-sourcemap > src imported sass > serve-src-imported-sass 1`] =
 exports[`serve:vue-sourcemap > ts > serve-ts 1`] = `
 {
   "ignoreList": [],
-  "mappings": ";AAKA,QAAQ,IAAI,WAAW;;;;;AAIvB,YAAQ,IAAI,UAAU;;;;;;;;uBARpB,oBAAiB,WAAd,MAAU",
+  "mappings": ";AAKA,QAAQ,IAAI,YAAW;;;;;AAIvB,UAAQ,IAAI,WAAU;;;;;;;;;;;sBARpB,oBAAiB,WAAd,OAAU",
   "sources": [
     "Ts.vue",
   ],
diff --git a/playground/vue-sourcemap/vite.config.ts b/playground/vue-sourcemap/vite.config.ts
@@ -1,5 +1,5 @@
 import vuePlugin from '@vitejs/plugin-vue'
-import { defineConfig } from 'vite'
+import { defineConfig } from 'rolldown-vite'
 
 export default defineConfig({
   css: {
diff --git a/playground/vue/vite.config.ts b/playground/vue/vite.config.ts
@@ -1,5 +1,5 @@
 import { resolve } from 'node:path'
-import { defineConfig, splitVendorChunkPlugin } from 'vite'
+import { defineConfig, splitVendorChunkPlugin } from 'rolldown-vite'
 import vuePlugin from '@vitejs/plugin-vue'
 import { vueI18nPlugin } from './CustomBlockPlugin'
 
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/pnpm-workspace.yaml b/pnpm-workspace.yaml
diff --git a/vitest.config.e2e.ts b/vitest.config.e2e.ts

Original file line number	Diff line number	Diff line change
`@@ -40,10 +40,10 @@`
`40`	`40`	`"@vue/babel-plugin-jsx": "^1.2.5"`
`41`	`41`	`},`
`42`	`42`	`"devDependencies": {`
`43`		`- "vite": "catalog:"`
	`43`	`+ "rolldown-vite": "catalog:"`
`44`	`44`	`},`
`45`	`45`	`"peerDependencies": {`
`46`		`- "vite": "^5.0.0 \|\| ^6.0.0",`
	`46`	`+ "rolldown-vite": "catalog:",`
`47`	`47`	`"vue": "^3.0.0"`
`48`	`48`	`}`
`49`	`49`	`}`