前端Vue3+uni+Ts

本次记录小兔仙仙的制作过程。

先看下我们的项目截图。主要是手机端,这里用了uniapp+VScode.三端适配的。可以打包成安卓和苹果。微信小程序。

首先:创建一个uni新的ts项目。

# 通过 git 从 gitee 克隆下载 登录 - Gitee.com

 git clone -b vite-ts https://gitee.com/dcloud/uni-preset-vue.git

直接修改package.json文件。避免安装一大堆东西。 然后pnpm i

{"name": "uni-app-vue3-starter","version": "0.0.0","scripts": {"dev:app": "uni -p app","dev:app-android": "uni -p app-android","dev:app-ios": "uni -p app-ios","dev:custom": "uni -p","dev:h5": "uni","dev:h5:ssr": "uni --ssr","dev:mp-alipay": "uni -p mp-alipay","dev:mp-baidu": "uni -p mp-baidu","dev:mp-kuaishou": "uni -p mp-kuaishou","dev:mp-lark": "uni -p mp-lark","dev:mp-qq": "uni -p mp-qq","dev:mp-toutiao": "uni -p mp-toutiao","dev:mp-weixin": "uni -p mp-weixin","dev:quickapp-webview": "uni -p quickapp-webview","dev:quickapp-webview-huawei": "uni -p quickapp-webview-huawei","dev:quickapp-webview-union": "uni -p quickapp-webview-union","build:app": "uni build -p app","build:app-android": "uni build -p app-android","build:app-ios": "uni build -p app-ios","build:custom": "uni build -p","build:h5": "uni build","build:h5:ssr": "uni build --ssr","build:mp-alipay": "uni build -p mp-alipay","build:mp-baidu": "uni build -p mp-baidu","build:mp-kuaishou": "uni build -p mp-kuaishou","build:mp-lark": "uni build -p mp-lark","build:mp-qq": "uni build -p mp-qq","build:mp-toutiao": "uni build -p mp-toutiao","build:mp-weixin": "uni build -p mp-weixin","build:quickapp-webview": "uni build -p quickapp-webview","build:quickapp-webview-huawei": "uni build -p quickapp-webview-huawei","build:quickapp-webview-union": "uni build -p quickapp-webview-union","tsc": "vue-tsc --noEmit --skipLibCheck","lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore","prepare": "husky install","lint-staged": "lint-staged"},"lint-staged": {"*.{js,ts,vue}": ["eslint --fix"]},"dependencies": {"@dcloudio/uni-app": "3.0.0-3090620231104002","@dcloudio/uni-app-plus": "3.0.0-3090620231104002","@dcloudio/uni-components": "3.0.0-3090620231104002","@dcloudio/uni-h5": "3.0.0-3090620231104002","@dcloudio/uni-mp-alipay": "3.0.0-3090620231104002","@dcloudio/uni-mp-baidu": "3.0.0-3090620231104002","@dcloudio/uni-mp-jd": "3.0.0-3090620231104002","@dcloudio/uni-mp-kuaishou": "3.0.0-3090620231104002","@dcloudio/uni-mp-lark": "3.0.0-3090620231104002","@dcloudio/uni-mp-qq": "3.0.0-3090620231104002","@dcloudio/uni-mp-toutiao": "3.0.0-3090620231104002","@dcloudio/uni-mp-weixin": "3.0.0-3090620231104002","@dcloudio/uni-mp-xhs": "3.0.0-3090620231104002","@dcloudio/uni-quickapp-webview": "3.0.0-3090620231104002","@dcloudio/uni-ui": "^1.4.28","pinia": "2.0.27","pinia-plugin-persistedstate": "^3.2.0","vue": "^3.3.4","vue-i18n": "^9.2.2"},"devDependencies": {"@dcloudio/types": "^3.4.3","@dcloudio/uni-automator": "3.0.0-3090620231104002","@dcloudio/uni-cli-shared": "3.0.0-3090620231104002","@dcloudio/uni-stacktracey": "3.0.0-3090620231104002","@dcloudio/uni-vue-devtools": "3.0.0-alpha-3080220230511001","@dcloudio/vite-plugin-uni": "3.0.0-3090620231104002","@rushstack/eslint-patch": "^1.1.4","@types/node": "^18.11.9","@uni-helper/uni-app-types": "^0.5.12","@uni-helper/uni-ui-types": "^0.5.11","@vue/eslint-config-prettier": "^7.0.0","@vue/eslint-config-typescript": "^11.0.0","@vue/runtime-core": "^3.2.45","@vue/tsconfig": "^0.4.0","eslint": "^8.22.0","eslint-plugin-vue": "^9.3.0","husky": "^8.0.0","lint-staged": "^13.0.3","miniprogram-api-typings": "^3.12.0","prettier": "^2.7.1","sass": "^1.56.1","typescript": "^5.1.6","vite": "^4.0.3","vue-tsc": "^1.8.8"}
}

拉取这个模板代码。

erabbit-uni-app-vue3-ts: uni-app 小兔鲜儿的项目模板

安装uni-ui,也可以安装你熟悉的其他组件,如饿了么ui.

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/817298.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

构建跨设备3D应用:HOOPS的跨平台开发能力

在当今数字化和可视化需求不断提升的时代,三维技术的应用越来越广泛,尤其在制造、建筑、工程及媒体行业。HOOPS,由Tech Soft 3D开发,是一套全面的软件开发工具包,用于构建高性能的三维应用程序。该工具包涵盖了从三维渲…

Centos7在线安装mysql5.7

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目录 安装Mysql yum源1、卸载旧环境2、下载mysql yum源3、上传到自己服务器1)、上传源2)、安装yum源3)、查看yum源是否安装成功 安装M…

信息系统项目管理师——管理类计算

风险管理——风险曝光度 风险曝光度概率*影响,概率指风险发生的概率,影响指风险一旦发生,受到影响的项。 题号【GX20061101](61) 知识点[风险曝光度] 风险的成本估算完成后,可以针对风险表中每个风险计算其风险曝光度。某软件小…

面试官:MySQL的自增 ID 用完了,怎么办?

如果你用过或了解过MySQL,那你一定知道自增主键了。每个自增id都是定义了初始值,然后按照指定步长增长(默认步长是1)。虽然,自然数是没有上限的,但是我们在设计表结构的时候,通常都会指定字段长…

0.25W 3KVDC 隔离单、双输出 DC/DC SMD 型电源模块 ——TPVT-W2 系列

TPVT-W2系列是一款标准的表面贴装电源模块,完全实现采用全自动贴片机来组装和满足回流焊工艺,大大提高产能和降低人工费用。此系列产品小,效率高,低输出纹波及提供3000V以上的直流电压隔离,SMD封装。

从数据中台到上层应用全景架构示例

一、前言 对于大型企业而言,数据已经成为基本的生产资料,但是有很多公司还是值关心上层应用,而忽略了数据的治理,从而并不能很好的发挥公司的数据资产效益。比如博主自己是做后端的,主要是做应用层,也就是…

计算机网络 Cisco路由信息协议(RIP)实验

一、实验内容 1、命名 2、关闭域名解释 3、设置路由器接口IP地址 4、根据要求配置RIP以实现所有客户机都能相互通信 5、配置默认路由 二、实验数据处理 1、建立拓扑图 2、PC机地址配置 主机IP地址子网掩码网关PC110.23.1.2255.255.255.010.23.1.1PC210.23.1.3255.255.2…

OR36 链表的回文结构

描述 对于一个链表,请设计一个时间复杂度为O(n),额外空间复杂度为O(1)的算法,判断其是否为回文结构。 给定一个链表的头指针A,请返回一个bool值,代表其是否为回文结构。保证链表长度小于等于900。 测试样例: 1->…

代码随想录算法练习Day13:有效的字母异位词

题目: 给定两个字符串 s 和 t ,编写一个函数来判断 t 是否是 s 的字母异位词。 注意:若 s 和 t 中每个字符出现的次数都相同,则称 s 和 t 互为字母异位词。 题目链接:242.有效的字母异位词 卡哥的视频讲解&#xff…

SCM供应链一体化平台:增强企业竞争力的必备利器

SCM供应链一体化平台是一种集成的软件系统,用于管理和优化企业的供应链活动。它将供应链中的各个环节,如采购、生产、物流、销售等,整合在一个统一的平台上,实现信息共享、协同工作和流程优化。 SCM供应链一体化平台的主要功能包括…

Linux/Iclean

Iclean Enumeration nmap 先使用默认规则扫描常用的端口,发现对外开放了 22 和 80 端口,然后扫描这两个端口的详细信息,结果如下,很常规的结果,没发现什么有趣的东西 ┌──(kali㉿kali)-[~/vegetable/HTB/Iclean] …

Appium 并发测试之 python 启动 appium 服务

python 启动appium服务,需要使用subprocess模块,该模块可以创建新的进程,并且连接到进程的输入,输出,错误等管道信息,并且可以获取进程的返回值 测试场景 使用python启动2台appium服务,端口配置…

永久关闭 Windows 11 系统更新

永久关闭 Windows 11 系统更新 请注意,关闭系统更新可能会使您的系统面临安全风险。确保您了解可能的后果,并在必要时考虑重新启用更新。 使用组策略编辑器(仅限 Windows 11 Pro 和 Enterprise 版) 步骤 1:打开本地…

Unsupervised Learning ~ Anomaly detection

unusual events vibration: 振动 Density estimation: Gaussian(normal) Distribution. standard deviation: 标准差 variance deviation sigma Mu Parameter estimation Anomaly detection algorithm 少量异常样本点的处理经验 algorithm evaluation skewed datatsets:…

【第十五届】蓝桥杯省赛C++b组

今年的蓝桥杯省赛已经结束了,与以往不同,今年又回到了8道题,而22,23年出现了10道题 大家觉得难度怎么样,欢迎进来讨论,博主今年没参加哈,大家聊聊,我听听大家的意见和看法哈 试题A:…

HTML制作跳动的心形网页

作为一名码农 也有自己浪漫的小心思嗷~ 该网页 代码整体难度不大 操作性较强 祝大家都幸福hhhhh 效果成品&#xff1a; 全部代码&#xff1a; <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML><HEAD><TITLE> 一个…

静电对集成电路封装的危害及防范措施

在现代工业生产中&#xff0c;静电已经成为一个不可忽视的问题。特别是在集成电路&#xff08;IC&#xff09;封装领域&#xff0c;静电可能对产品质量和生产效率造成严重的影响。本文将探讨静电对IC封装的危害&#xff0c;并介绍一些防范措施以减少静电带来的风险。 静电对IC封…

ubuntu下的串口调试工具cutecom

系统&#xff1a;ubuntu20.04 &#xff08;1&#xff09;接线 使用 rs485&#xff1c;-----> rs232 转接口&#xff08; 设备直接出来的是rs485&#xff09;&#xff0c;电脑主机接入一根 rs232&#xff1c;-----> USB口 连接线&#xff0c;ubuntu系统下打开 termin…

【深入理解Java IO流0x09】解读Java NIO核心知识(下篇)

1. NIO简介 在开始前&#xff0c;让我们再简单回顾一下NIO。 在传统的 Java I/O 模型&#xff08;BIO&#xff09;中&#xff0c;I/O 操作是以阻塞的方式进行的。也就是说&#xff0c;当一个线程执行一个 I/O 操作时&#xff0c;它会被阻塞直到操作完成。这种阻塞模型在处理多…

2024/4/15 AD/DA

AD&#xff08;Analog to Digital&#xff09;&#xff1a;模拟-数字转换&#xff0c;将模拟信号转换为计算机可操作的数字信号 DA&#xff08;Digital to Analog&#xff09;&#xff1a;数字-模拟转换&#xff0c;将计算机输出的数字信号转换为模拟信号 AD/DA转换打开了计算…