当前位置： 首页 > article >正文

uni-app 使用vscode开发uni-app

article 2024/12/24 9:11:23

安装插件 uni-create-view

用于快速创建页面

在这里插入图片描述

配置插件

在这里插入图片描述
在这里插入图片描述

创建页面

在这里插入图片描述
在这里插入图片描述
输入页面名称，空格，顶部导航的标题，回车

自动生成页面并在pages.json中注册了路由

pages\login\login.vue

<template>
  <div class="login">login</div>
</template>

<script lang="ts" setup>
</script>

<style lang="scss" scoped></style>

需将 div 改为 view
在这里插入图片描述

安装插件 uni-helper

用于展示代码提示，支持更多代码快捷输入，添加语法提示等。

在这里插入图片描述

在这里插入图片描述

安装插件 uniapp小程序扩展

用于鼠标悬停官方组件标签时，提示标签解析和官方文档的跳转

在这里插入图片描述
在这里插入图片描述

配置支持给json文件添加注释

仅对 manifest.json 和 pages.json 有效

打开设置
在这里插入图片描述
搜索Associations，添加项 manifest.json 和 pages.json ，值为 jsonc

在这里插入图片描述

配置支持TS类型校验

1. 安装类型声明文件

cnpm i -D @types/wechat-miniprogram @uni-helper/uni-app-types

2. 配置

tsconfig.json 中添加

      "@types/wechat-miniprogram",
      "@uni-helper/uni-app-types"

在这里插入图片描述

  "vueCompilerOptions": {
    "nativeTags": ["block", "component", "template", "slot"]
  },

在这里插入图片描述


http://www.kler.cn/a/135873.html

相关文章：

  • Android Https和WebView
  • 图片懒加载
  • 黑马Java面试教程_P8_并发编程
  • 深入理解 HTTP HEAD 请求：节省带宽、提高效率的秘密武器
  • Python读取Excel批量写入到PPT生成词卡
  • tslib(触摸屏输入设备的轻量级库)的学习、编译及测试记录
  • 接口自动化和UI自动化的区别
  • 实现CAS自旋锁
  • 工程项目立项需要做哪些准备？
  • 视频转码方法：多种格式视频批量转FLV视频的技巧
  • 【Linux网络】详解使用http和ftp搭建yum仓库，以及yum网络源优化
  • git常用命令和参数有哪些？【git看这一篇就够了】
  • 【开题报告】基于SpringBoot的网上摄影工作室的设计与实现
  • 前端面试考核点【更持续新中】
  • 根据nginx日志统计页面访问次数
  • 指针变量和地址
  • 11.1 文件拷贝移动与删除
  • 【Java】异常处理（一）
  • K8S基础笔记
  • 极域电子教室-教师机无法找到学生机
  • ArcEngine：如何进行缩放图层、属性信息显示、状态栏显示？
  • 关于这个“这是B站目前讲的最好的【Transformer实战】教程！“视频的目前可以运行的源代码GPU版本
  • 采集1688整店商品（店铺所有商品、店铺列表api）
  • 北京君正客户应用案例：掌静脉3D人脸猫眼视屏智能锁
  • 信息机房监控系统(动环辅助监控系统)
  • 4种经典的限流算法与集群限流