uniapp项目启动报错:Uncaught TypeError: Cannot read property ‘meta‘ of undefined处理方案

简介: 刚入门uniapp,简单记录一下希望对有同样问题的小伙伴有所帮助,尽量少浪费时间.

  刚入门uniapp,简单记录一下希望对有同样问题的小伙伴有所帮助,尽量少浪费时间.

   新创建的uniapp项目,项目启动之后就报错,是不是很挫败,第一步就有问题!!!具体报错信息如下:

Uncaught TypeError: Cannot read property 'meta' of undefined

控制台截图:

44298408070e21e353bebcf903d1a3fd_8aa74c43fe5d435790c446fa6a0f3b45.png

   发现将pages.json中的tabbar节点全部注释掉之后启动正常,进一步来看将tabbar中的list属性注释掉之后项目启动也是正常的.到这里就是页面路径的问题.仔细观察发现项目pages下面的页面路径信息没有配置,导致tabbar中加载页面异常,按照页面加载顺序补充完整即可.项目启动是按照pages下面的页面的顺序进行加载,有文件但是配置中没有加载就会报错,tabbar的list属性中再去找对应的页面更会报错.正常的pages页面配置如下:

pages对象:

"pages": [ 
    {
      "path": "pages/index/index",
      "style": {
        "navigationBarTitleText": "uni-app"
      }
    },
    {
      "path": "pages/message/message",
      "style": {
        "navigationBarTitleText": "",
        "enablePullDownRefresh": false
      }
    }
  ]


页面截图:

c7ccdf8e16c03d0b408f58766a94ca31_11e5c9ece26a42d6a24ead9fa4033095.png

tabbar页面配置:

"tabBar": { //底部
    "color": "#999999",
    "selectedColor": "#09C160",
    "borderStyle": "black",
    "backgroundColor": "#ffffff",
    "list": [{
        "pagePath": "pages/index/index",
        "text": "首页"
      },
      {
        "pagePath": "pages/message/message",
        "text": "消息"
      }
    ]
  }


页面截图如下:

435a29eb0a06bdbd2a7fbc8a48cf8715_b5b77462eb5c431fa28d74a049b47e44.png


相关文章
|
4月前
|
缓存 iOS开发 MacOS
uniapp发布快应用失败报错Error: ENOENT: no such file or directory以及hap-chimera-toolkit问题优雅草卓伊凡
uniapp发布快应用失败报错Error: ENOENT: no such file or directory以及hap-chimera-toolkit问题优雅草卓伊凡
585 2
uniapp发布快应用失败报错Error: ENOENT: no such file or directory以及hap-chimera-toolkit问题优雅草卓伊凡
|
10月前
|
人工智能 移动开发 JavaScript
如何用uniapp打包桌面客户端exe包,vue或者uni项目如何打包桌面客户端之electron开发-优雅草央千澈以开源蜻蜓AI工具为例子演示完整教程-开源代码附上
如何用uniapp打包桌面客户端exe包,vue或者uni项目如何打包桌面客户端之electron开发-优雅草央千澈以开源蜻蜓AI工具为例子演示完整教程-开源代码附上
1016 18
|
8月前
|
JSON 自然语言处理 前端开发
【01】对APP进行语言包功能开发-APP自动识别地区ip后分配对应的语言功能复杂吗?-成熟app项目语言包功能定制开发-前端以uniapp-基于vue.js后端以laravel基于php为例项目实战-优雅草卓伊凡
【01】对APP进行语言包功能开发-APP自动识别地区ip后分配对应的语言功能复杂吗?-成熟app项目语言包功能定制开发-前端以uniapp-基于vue.js后端以laravel基于php为例项目实战-优雅草卓伊凡
398 72
【01】对APP进行语言包功能开发-APP自动识别地区ip后分配对应的语言功能复杂吗?-成熟app项目语言包功能定制开发-前端以uniapp-基于vue.js后端以laravel基于php为例项目实战-优雅草卓伊凡
|
10月前
|
iOS开发 开发者
uniapp开发ios打包Error code = -5000 Error message: Error: certificate file(p12) import failed!报错问题如何解决
uniapp开发ios打包Error code = -5000 Error message: Error: certificate file(p12) import failed!报错问题如何解决
591 67
uniapp开发ios打包Error code = -5000 Error message: Error: certificate file(p12) import failed!报错问题如何解决
|
JSON JavaScript 小程序
使用VSCode搭建UniApp + TS + Vue3 + Vite项目
`uniapp` 是一个基于 Vue.js 的框架,支持一次开发多端部署,深受前端开发者喜爱。本文详细介绍如何使用 `VSCode` 搭建 `uniapp` 项目,包括安装 `node` 和 `pnpm`、创建项目、安装扩展组件、配置 `Json` 文件注释及安装相关插件。通过这些步骤,你可以高效地使用 `VSCode` 开发 `uniapp` 项目,并享受代码提示和自动补全功能,提高开发效率。
906 24
使用VSCode搭建UniApp + TS + Vue3 + Vite项目
|
移动开发 小程序 数据可视化
基于npm CLI脚手架的uniapp项目创建、运行与打包全攻略(微信小程序、H5、APP全覆盖)
基于npm CLI脚手架的uniapp项目创建、运行与打包全攻略(微信小程序、H5、APP全覆盖)
2183 3
|
小程序 前端开发 Java
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
JavaDog Chat v1.0.0 是一款基于 SpringBoot、MybatisPlus 和 uniapp 的简易聊天软件,兼容 H5、小程序和 APP,提供丰富的注释和简洁代码,适合初学者。主要功能包括登录注册、消息发送、好友管理及群组交流。
333 0
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
|
存储 JavaScript 前端开发
成功解决:Cannot read properties of undefined (reading ‘commit‘)
这篇文章提供了解决Vuex中"Cannot read properties of undefined (reading 'commit')"错误的两种方法:检查模板中的数据属性是否存在,以及确保在Vue实例中正确挂载了store对象。
成功解决:Cannot read properties of undefined (reading ‘commit‘)
|
Web App开发 JavaScript 小程序
【有问必答】搭建uniapp项目流程手把手教学
本文详细介绍了uniapp项目的搭建流程、组件引入、接口封装及常用配置。作者“狗哥”应博友之邀,分享了其日常开发经验,包括HBuilderX的使用、uview-ui和moment.js的引入与配置、环境变量设置、HTTP请求封装及API接口管理等内容。文章强调理解官方文档的重要性,并提供了具体步骤和示例代码,帮助读者快速掌握uniapp开发技巧。
417 0
【有问必答】搭建uniapp项目流程手把手教学
|
移动开发 JavaScript 前端开发
【绝技揭秘】从零到英雄:解锁UniApp H5项目中的二维码生成与扫描秘籍,让你的应用瞬间变身扫码达人!
【8月更文挑战第20天】二维码在移动应用中无处不在。本文详述了在UniApp H5项目中实现二维码生成与扫描的方法。通过对比插件`uni-app-qrcode`和JavaScript库`qrcode-generator`生成二维码的方式,以及使用插件`@juggle/resize-observer`和HTML5的MediaDevices API进行扫描的技术方案,帮助开发者挑选最佳实践。无论是插件的便捷性还是原生JavaScript的灵活性,都能满足不同项目需求。
813 0

热门文章

最新文章