Hacktoberfest 2026:维护者为十月标记出来的 issue,仍然开放、适合新手。 浏览 Hacktoberfest issue

fix: routing is not working & ionicons not importing correctly

未关闭
#188 11 条评论 0 个 reaction 已指派 0 人 在 GitHub 查看

维护者通常 1 天内回复

还没有人认领这个 Issue。

评估

难度
4/5
预计耗时
3-5 天
新手友好度
25/100
Issue 类型
缺陷
描述清晰度
需要澄清
活跃度
停滞
技术栈
nuxtjs, pug
领域
frontend, mobile

调研方向

从链接的 ionic-nuxt-3 复现开始,检查 app.vue 和 components/Ui/Tabs.vue,然后检查 pages/tabs/Home.vue 和 pages/tabs/Schedule.vue。复现选项卡变化和图标错误,并在两个选项卡都能分别进行路由且两个图标都能正确导入和显示时,视为该 issue 已完成。

由索引模型根据 Issue 内容生成。

描述

bug
🐛 The bug

routing is absolutely broken with me, in addition to the issue that nothing works unless i install @ionic/vue
and icons are not importing correctly

icons error:
image

what happens when I change tabs:
image

as you can see the tabs just get displayed together

if I change tabs again this comes in the console:
image

app.vue:
<template lang="pug">
ionApp
  UiTabs
</template>
components/Ui/Tabs.vue:
<template lang="pug">
ionPage
   ionTabs
      ionRouterOutlet
      //- https://ionicframework.com/docs/vue/navigation#working-with-tabs
      ionTabBar(slot="bottom")
         ionTabButton(tab="home" href="/tabs/home")
            ionIcon( :icon="ioniconsHome" )
            ionLabel Home
         ionTabButton(tab="schedule" href="/tabs/schedule")
            ionIcon( :icon="ioniconsCalendar" )
            ionLabel Schedule
</template>
pages/tabs/Home.vue
<template lang="pug">
h1 this is the home tab
</template>
pages/tabs/Schedule.vue
<template lang="pug">
h1 this is the schedule tab
</template>
🛠️ To reproduce

https://github.com/NyllRE/ionic-nuxt-3

🌈 Expected behaviour
  • tabs change correctly
  • icons get imported and displayed
ℹ️ Additional context

I tried to remake the project multiple times and these errors keep coming, I install @nuxtjs/ionic and no component is known, I install @ionic/vue and the routing is broken, I install @ionic/vue-routing and the ionicons are not working and the routing is broken. nothing seems to be working fine with my experience

主要语言
TypeScript
星标
458
派生
53
平均合并
16 小时 55 分钟
30 天内合并 PR
24

环境准备

这个项目没有提供开发容器、Dockerfile 或贡献指南,环境需要你自己搭建:先看它的 README,通用步骤见我们的新手贡献指南。

从这里开始

  1. 先读完整个 Issue,再读项目的贡献指南。
  2. 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
  3. Fork 仓库,在一个分支上完成修改。
  4. 提交 Pull Request,并在描述里引用这个 Issue 编号。

nuxt-modules/ionic 的其他 Issue

查看 nuxt-modules/ionic 的全部 Issue

相似的 Issue

更多 TypeScript Issue

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。