vite-plugin-taro 0.5.4 → 0.5.5

package/README.en.md

@@ -1,7 +1,7 @@
 # vite-plugin-taro
 
 [![npm version](https://img.shields.io/npm/v/vite-plugin-taro.svg)](https://www.npmjs.com/package/vite-plugin-taro)
-![Vite compatibility](https://registry.vite.dev/api/badges?package=vite-plugin-taro&tool=vite)
+![Vite](https://img.shields.io/npm/dependency-version/vite-plugin-taro/peer/vite?label=Vite)
 [![license](https://img.shields.io/badge/license-MIT-blue.svg)](LICENSE)
 
 [简体中文](README.md) | English

package/README.md

@@ -1,7 +1,7 @@
 # vite-plugin-taro
 
 [![npm version](https://img.shields.io/npm/v/vite-plugin-taro.svg)](https://www.npmjs.com/package/vite-plugin-taro)
-![Vite compatibility](https://registry.vite.dev/api/badges?package=vite-plugin-taro&tool=vite)
+![Vite](https://img.shields.io/npm/dependency-version/vite-plugin-taro/peer/vite?label=Vite)
 [![license](https://img.shields.io/badge/license-MIT-blue.svg)](LICENSE)
 
 简体中文 | [English](README.en.md)

package/dist/node/plugins/h5/create-stencil-client-adapter.d.ts

@@ -9,16 +9,13 @@ import type { Plugin } from 'vite';
  * exclusion while keeping one transformation implementation.
  */
 export declare function createStencilClientAdapter(): Plugin;
-/** Applies the shared Stencil adaptation in either the application or dependency-optimization pipeline. */
-export declare function adaptStencilClient(code: string, id: string): Promise<{
-    code: string;
-    map: {
-        version: number;
-        sources: string[];
-        names: string[];
-        sourceRoot?: string | undefined;
-        sourcesContent?: string[] | undefined;
-        mappings: string;
-        file: string;
-    } | null | undefined;
-} | undefined>;
+/**
+ * Applies the shared Stencil adaptation with one Oxc parse and one range edit.
+ *
+ * The physical module check is essential because the optimizer and application pipelines can
+ * present query-suffixed or platform-normalized IDs. Transforming by source text alone could
+ * modify user code that happens to contain the same insertion expression. Source maps remain
+ * enabled because this adapter runs before Vite/Rolldown's later transforms in both pipelines;
+ * dropping the map would attribute downstream diagnostics to the edited generated positions.
+ */
+export declare function adaptStencilClient(code: string, id: string): import("../../utils/transform.ts").AstTransformResult | undefined;

package/dist/node/plugins/h5/create-stencil-client-adapter.js

@@ -1,5 +1,5 @@
-import { transformAsync, types } from '@babel/core';
 import { normalizeModuleId } from '../../utils/modules.js';
+import { transformWithOxcWalker } from '../../utils/oxc-transform.js';
 import { packageRequire } from '../../utils/packages.js';
 const stencilClientPath = packageRequire.resolve('@stencil/core/internal/client', {
     paths: [packageRequire.resolve('@tarojs/components/package.json')]
@@ -20,61 +20,73 @@ export function createStencilClientAdapter() {
         transform: adaptStencilClient
     };
 }
-/** Applies the shared Stencil adaptation in either the application or dependency-optimization pipeline. */
-export async function adaptStencilClient(code, id) {
+/**
+ * Applies the shared Stencil adaptation with one Oxc parse and one range edit.
+ *
+ * The physical module check is essential because the optimizer and application pipelines can
+ * present query-suffixed or platform-normalized IDs. Transforming by source text alone could
+ * modify user code that happens to contain the same insertion expression. Source maps remain
+ * enabled because this adapter runs before Vite/Rolldown's later transforms in both pipelines;
+ * dropping the map would attribute downstream diagnostics to the edited generated positions.
+ */
+export function adaptStencilClient(code, id) {
     if (normalizeModuleId(id) !== normalizedStencilClientPath) {
         return;
     }
-    const transformed = await transformAsync(code, {
-        babelrc: false,
-        configFile: false,
-        filename: stencilClientPath,
-        plugins: [rewriteStencilStyleInsertion],
-        sourceFileName: stencilClientPath,
-        sourceMaps: true
+    return transformWithOxcWalker({
+        code,
+        filename: id,
+        sourcemap: true,
+        createVisitor: createStencilVisitor
     });
-    if (transformed?.code === undefined || transformed.code === null) {
-        throw new Error(`Failed to adapt Stencil client: ${stencilClientPath}`);
-    }
-    return {
-        code: transformed.code,
-        map: transformed.map
-    };
 }
-/** Keeps Stencil-injected Taro component styles before application stylesheets. */
-function rewriteStencilStyleInsertion() {
-    return {
-        name: 'vpt:rewrite-stencil-style-insertion',
-        visitor: {
-            CallExpression(callPath) {
-                if (!isStencilStyleInsertBeforeCall(callPath)) {
-                    return;
-                }
-                callPath
-                    .get('arguments.1')
-                    .replaceWith(types.conditionalExpression(types.callExpression(types.memberExpression(types.identifier('scopeId'), types.identifier('startsWith')), [types.stringLiteral('sc-taro-')]), createStyleQuery('style,link[rel="stylesheet"]'), createStyleQuery('link')));
-            }
+/**
+ * Finds Stencil's exact default style insertion call and replaces only its insertion anchor.
+ *
+ * Stencil normally inserts `styleElm` before the first stylesheet link. During Vite development,
+ * application CSS is commonly represented by a `<style>` element instead, so that link-only
+ * lookup returns `null` and Taro component defaults are appended after application CSS. Those
+ * defaults then override the application's selectors despite having the same specificity.
+ *
+ * Taro Stencil components are identified by the `sc-taro-` scope prefix. For those components,
+ * the replacement anchors before the first `<style>` or stylesheet `<link>`, keeping component
+ * defaults before application rules. The original link-only lookup is preserved for every other
+ * Stencil component so VPT does not globally redefine upstream style-ordering behavior.
+ */
+function createStencilVisitor(editor) {
+    return function enter(node) {
+        if (node.type !== 'CallExpression' ||
+            node.callee.type !== 'MemberExpression' ||
+            node.callee.computed ||
+            node.callee.object.type !== 'Identifier' ||
+            node.callee.object.name !== 'styleContainerNode' ||
+            node.callee.property.type !== 'Identifier' ||
+            node.callee.property.name !== 'insertBefore') {
+            return;
+        }
+        // Match the complete upstream call, not merely `insertBefore`: range edits have no
+        // generated-AST type safety, so a broad match could silently alter unrelated runtime
+        // behavior when Stencil changes its implementation.
+        const [style, query] = node.arguments;
+        const selector = query?.type === 'CallExpression' ? query.arguments[0] : undefined;
+        if (node.arguments.length !== 2 ||
+            style?.type !== 'Identifier' ||
+            style.name !== 'styleElm' ||
+            query?.type !== 'CallExpression' ||
+            query.callee.type !== 'MemberExpression' ||
+            query.callee.computed ||
+            query.callee.object.type !== 'Identifier' ||
+            query.callee.object.name !== 'styleContainerNode' ||
+            query.callee.property.type !== 'Identifier' ||
+            query.callee.property.name !== 'querySelector' ||
+            selector?.type !== 'Literal' ||
+            selector.value !== 'link') {
+            return;
         }
+        // Replace only the second argument expression. Preserving the surrounding Stencil
+        // source avoids Babel-style whole-file regeneration and keeps its formatting, comments,
+        // and source positions stable. Removing this edit restores the H5 cascade bug described
+        // above; applying it unconditionally would change non-Taro Stencil components.
+        editor.overwrite(query.start, query.end, 'scopeId.startsWith("sc-taro-") ? styleContainerNode.querySelector("style,link[rel=\\"stylesheet\\"]") : styleContainerNode.querySelector("link")');
     };
 }
-/** Identifies Stencil's default component-style insertion call. */
-function isStencilStyleInsertBeforeCall(callPath) {
-    const { callee, arguments: callArguments } = callPath.node;
-    return (types.isMemberExpression(callee) &&
-        types.isIdentifier(callee.object, { name: 'styleContainerNode' }) &&
-        types.isIdentifier(callee.property, { name: 'insertBefore' }) &&
-        types.isIdentifier(callArguments[0], { name: 'styleElm' }) &&
-        isStyleQuery(callArguments[1], 'link'));
-}
-/** Identifies one style-container querySelector call. */
-function isStyleQuery(node, selector) {
-    return (types.isCallExpression(node) &&
-        types.isMemberExpression(node.callee) &&
-        types.isIdentifier(node.callee.object, { name: 'styleContainerNode' }) &&
-        types.isIdentifier(node.callee.property, { name: 'querySelector' }) &&
-        types.isStringLiteral(node.arguments[0], { value: selector }));
-}
-/** Creates one style-container querySelector call. */
-function createStyleQuery(selector) {
-    return types.callExpression(types.memberExpression(types.identifier('styleContainerNode'), types.identifier('querySelector')), [types.stringLiteral(selector)]);
-}

package/dist/node/plugins/h5/plugins.d.ts

@@ -2,3 +2,13 @@ import type { PluginOption } from 'vite';
 import type { VitePluginTaroOptions } from '../../../options.ts';
 /** Creates the plugins that own the H5 target. */
 export declare function createH5TargetPlugins(options: VitePluginTaroOptions): PluginOption[];
+/**
+ * Coarse source prefilter for the upstream Taro API transform.
+ *
+ * The plugin has two independent responsibilities: adapting imports from the compiler facade and normalizing camel-case
+ * H5 ARIA attributes. Matching `aria` followed by any uppercase letter is intentionally broader than Taro's current
+ * attribute table. A duplicated exact list would silently stop routing files through Babel when upstream adds another
+ * attribute, while a broad false positive costs only one unnecessary transform. Ordinary application modules match
+ * neither branch and remain entirely outside Babel's parser and generator.
+ */
+export declare const h5TaroApiTransformCodeFilter: RegExp;

package/dist/node/plugins/h5/plugins.js

@@ -1,4 +1,4 @@
-import babel from '@rolldown/plugin-babel';
+import babel, { defineRolldownBabelPreset } from '@rolldown/plugin-babel';
 import { esTarget } from '../../utils/constant.js';
 import { toViteFileImportPath } from '../../utils/modules.js';
 import { packageRequire } from '../../utils/packages.js';
@@ -88,20 +88,48 @@ function createH5IndexHtmlTags() {
         }
     ];
 }
-/** Creates H5-only Babel transforms for Stencil CSS ordering and Taro API imports. */
+/**
+ * Coarse source prefilter for the upstream Taro API transform.
+ *
+ * The plugin has two independent responsibilities: adapting imports from the compiler facade and normalizing camel-case
+ * H5 ARIA attributes. Matching `aria` followed by any uppercase letter is intentionally broader than Taro's current
+ * attribute table. A duplicated exact list would silently stop routing files through Babel when upstream adds another
+ * attribute, while a broad false positive costs only one unnecessary transform. Ordinary application modules match
+ * neither branch and remain entirely outside Babel's parser and generator.
+ */
+export const h5TaroApiTransformCodeFilter = /virtual:taro\/api|\baria[A-Z]/;
+/** Creates a filterable Babel preset containing Taro's upstream, scope-aware API transform. */
+function createH5TaroApiPreset() {
+    const transformTaroApiPath = packageRequire.resolve('babel-plugin-transform-taroapi');
+    const definition = packageRequire(packageRequire.resolve('@tarojs/plugin-platform-h5/dist/definition.json'));
+    return defineRolldownBabelPreset({
+        preset: function h5TaroApiPreset() {
+            return {
+                plugins: [
+                    [
+                        transformTaroApiPath,
+                        {
+                            packageName: clientTaroApiId,
+                            definition
+                        }
+                    ]
+                ]
+            };
+        },
+        rolldown: {
+            // @rolldown/plugin-babel can lift a preset filter into its native transform hook. The Taro plugin must be
+            // nested in this preset rather than passed through Babel's top-level `plugins`: explicit plugins may apply
+            // to every module, so their presence deliberately disables Rolldown's preset-level code filtering.
+            filter: { code: h5TaroApiTransformCodeFilter }
+        }
+    });
+}
+/** Creates H5-only transforms for Stencil CSS ordering and Taro API imports. */
 function createH5SupportPlugins() {
     return [
         createStencilClientAdapter(),
         babel({
-            plugins: [
-                [
-                    packageRequire.resolve('babel-plugin-transform-taroapi'),
-                    {
-                        packageName: clientTaroApiId,
-                        definition: packageRequire(packageRequire.resolve('@tarojs/plugin-platform-h5/dist/definition.json'))
-                    }
-                ]
-            ]
+            presets: [createH5TaroApiPreset()]
         })
     ];
 }