create-vite-taro 0.2.1 → 0.2.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-vite-taro",
-  "version": "0.2.1",
+  "version": "0.2.2",
   "description": "Create Vite 8 + React 19 + Taro apps for H5 and WeChat Mini Program targets.",
   "type": "module",
   "bin": {

package/templates/default/package.json

@@ -21,7 +21,8 @@
         "@types/react-dom": "^19.2.3",
         "typescript": "^7.0.1-rc",
         "cross-env": "^10.1.0",
+        "tailwindcss": "^4.3.1",
         "vite": "^8.0.16",
-        "vite-plugin-taro": "^0.2.1"
+        "vite-plugin-taro": "^0.2.2"
     }
 }

package/templates/default/src/components/navigation-bar/use-navigation-bar.ts

@@ -1,6 +1,8 @@
 import Taro from 'virtual:taro/api'
 import { useState } from 'react'
 
+const isWechatTarget = import.meta.env.VITE_PLUGIN_TARO_TARGET === 'wx'
+
 interface NavigationBarNavInfo {
     height: number
     top: number
@@ -44,7 +46,7 @@ function createFallbackMenuInfo(screenWidth: number): NavigationBarMenuInfo {
 }
 
 function getMenuInfo(screenWidth: number): NavigationBarMenuInfo {
-    if (IS_WEAPP) {
+    if (isWechatTarget) {
         const menuButtonInfo = Taro.getMenuButtonBoundingClientRect()
         if (menuButtonInfo.width > 0 && menuButtonInfo.height > 0) return menuButtonInfo
     }
@@ -55,7 +57,7 @@ function getMenuInfo(screenWidth: number): NavigationBarMenuInfo {
 export function initNavigationBar(): NavigationBarInfo {
     const windowInfo = Taro.getWindowInfo()
     const screenWidth = windowInfo.screenWidth || 375
-    const statusBarHeight = IS_WEAPP ? (windowInfo.statusBarHeight ?? 44) : 0
+    const statusBarHeight = isWechatTarget ? (windowInfo.statusBarHeight ?? 44) : 0
     const menuInfo = getMenuInfo(screenWidth)
     const menuButtonStatusBarGap = Math.max(0, menuInfo.top - statusBarHeight)
     const navBarHeight = menuButtonStatusBarGap * 2 + menuInfo.height + statusBarHeight

package/templates/default/src/global.d.ts

@@ -0,0 +1,3 @@
+interface ImportMetaEnv {
+    readonly VITE_PLUGIN_TARO_TARGET: 'wx' | 'h5'
+}

package/templates/default/src/pages/index/index.tsx

@@ -1,11 +1,11 @@
 import Taro from 'virtual:taro/api'
 import { Button, Text, View } from 'virtual:taro/components'
-import { NavigationBar } from "../../components/navigation-bar/navigation-bar.tsx"
+import { NavigationBar } from '../../components/navigation-bar/navigation-bar.tsx'
 
 function IndexPage() {
     return (
         <View className="flex flex-col h-screen overflow-hidden">
-            <NavigationBar title={'Vite Taro App'}/>
+            <NavigationBar title="Vite Taro App" />
             <View className="flex-1 flex items-center justify-center bg-slate-50 px-6 py-12">
                 <View className="rounded-3xl bg-white p-6 shadow-sm">
                     <Text className="block text-2xl font-semibold text-slate-950">Vite + Taro</Text>
@@ -15,7 +15,7 @@ function IndexPage() {
                     <Button
                         className="mt-6 rounded-xl bg-blue-600 px-4 py-2 text-white"
                         onClick={() => {
-                            Taro.showToast({title: 'Hello Taro'})
+                            Taro.showToast({ title: 'Hello Taro' })
                         }}
                     >
                         Show toast