taro icon indicating copy to clipboard operation
taro copied to clipboard

【taro4.1.7】 Vite编译下,自定义tabbar不显示,webpack编译没问题

Open huangmingfu opened this issue 3 months ago • 9 comments

请先确认

  • [x] 我已搜索并确定这个提交不是重复的

Taro 版本

v4

相关领域

None

使用框架

React

相关平台

  • [x] 微信小程序
  • [ ] 所有平台
  • [ ] Web 端(H5)
  • [ ] 移动端(React-Native)
  • [ ] 鸿蒙(Harmony)
  • [ ] 鸿蒙容器(Harmony Hybrid)
  • [ ] ASCF 元服务
  • [ ] 快应用(QuickApp)
  • [ ] 所有小程序
  • [ ] 企业微信小程序
  • [ ] 京东小程序
  • [ ] 百度小程序
  • [ ] 支付宝小程序
  • [ ] 支付宝 IOT 小程序
  • [ ] 头条小程序
  • [ ] QQ 小程序
  • [ ] 钉钉小程序
  • [ ] 飞书小程序
  • [ ] 快手小程序

小程序基础库版本

No response

问题描述

taro init myApp 创建的 vite + react18 模板项目,微信小程序端,无法正常显示tabbar页面。

Image

复现链接

https://github.com/huangmingfu/taro-demo

复现步骤

  1. 分别进入vite和webpack文件夹,pnpm i
  2. pnpm dev:weapp
  3. 运行 vite 和 webpack 的项目,vite 无法正常显示tabbar,都是通过taro init myApp 创建的模板项目

环境信息

👽 Taro v4.1.7


  Taro CLI 4.1.7 environment info:
    System:
      OS: Windows 11 10.0.22631
    Binaries:
      Node: 22.19.0 - F:\nvm\nodejs\node.EXE
      Yarn: 1.22.22 - F:\nvm\nodejs\yarn.CMD
      npm: 10.9.3 - F:\nvm\nodejs\npm.CMD
    npmPackages:
      @tarojs/cli: 4.1.7 => 4.1.7
      @tarojs/components: 4.1.7 => 4.1.7
      @tarojs/helper: 4.1.7 => 4.1.7
      @tarojs/plugin-framework-react: 4.1.7 => 4.1.7
      @tarojs/plugin-platform-alipay: 4.1.7 => 4.1.7
      @tarojs/plugin-platform-h5: 4.1.7 => 4.1.7
      @tarojs/plugin-platform-harmony-hybrid: 4.1.7 => 4.1.7
      @tarojs/plugin-platform-jd: 4.1.7 => 4.1.7
      @tarojs/plugin-platform-qq: 4.1.7 => 4.1.7
      @tarojs/plugin-platform-swan: 4.1.7 => 4.1.7
      @tarojs/plugin-platform-tt: 4.1.7 => 4.1.7
      @tarojs/plugin-platform-weapp: 4.1.7 => 4.1.7
      @tarojs/react: 4.1.7 => 4.1.7
      @tarojs/runtime: 4.1.7 => 4.1.7
      @tarojs/shared: 4.1.7 => 4.1.7
      @tarojs/taro: 4.1.7 => 4.1.7
      @tarojs/vite-runner: 4.1.7 => 4.1.7
      @tarojs/webpack5-runner: 4.1.7 => 4.1.7
      babel-preset-taro: 4.1.7 => 4.1.7
      eslint-config-taro: 4.1.7 => 4.1.7
      react: ^18.0.0 => 18.3.1

开源贡献

huangmingfu avatar Sep 28 '25 07:09 huangmingfu

设置 custom false 小程序可以显示,但是 h5 渲染图标路径错误。

Image

hungtcs avatar Oct 14 '25 09:10 hungtcs

设置 custom false 小程序可以显示,但是 h5 渲染图标路径错误。

Image

那这样的话使用的是小程序本身的tabbar,CustomTabBar 是不会渲染的,console.log('CustomTabBar'); 这一行不会打印,我这边需要的是自定义的tabbar

huangmingfu avatar Oct 16 '25 03:10 huangmingfu

有好的解决方案吗

HashCookie avatar Oct 22 '25 09:10 HashCookie

有好的解决方案吗

你看看能不能改用webpack5编译。我这个项目换不了webpack5编译,因为是memorepo的项目,我尝试过,这会导致webpack与memorepo的另一个问题了,相关issue: #15955 #17978

huangmingfu avatar Oct 23 '25 06:10 huangmingfu

有好的解决方案吗

你看看能不能改用webpack5编译。我这个项目换不了webpack5编译,因为是memorepo的项目,我尝试过,这会导致webpack与memorepo的另一个问题了,相关issue: #15955 #17978

ok

HashCookie avatar Oct 23 '25 06:10 HashCookie

同样的问题

scwlwj avatar Oct 24 '25 02:10 scwlwj

这么说如果项目中用到了「自定义tabbar」就不能用 vite 打包了是吗

bluescurry avatar Nov 07 '25 03:11 bluescurry

郁闷,我也是vite打包,按照官方文档都配置了,压根不渲染

xsfxtsxxr avatar Nov 25 '25 09:11 xsfxtsxxr

"@tarojs/taro": "4.1.8" "vite": "^4.2.0" 同样的,在上述版本下,CustomTabBar并没有编译成功,没有渲染,这个bug貌似都很久了,这么简单的功能都有问题呀

promonkeyli avatar Dec 07 '25 11:12 promonkeyli