uniapp 23 uniapp typescript支持

一、创建typescript支持的项目

官网 -> uniapp -> 介绍 -> 快速上手 -> 2.2. 通过vue-cli命令行

创建 vue3 项目

创建以 typescript 开发的工程(如命令行创建失败,请直接访问 gitee 下载模板)

npx degit dcloudio/uni-preset-vue#vite-ts my-vue3-project


package.json

{
  "name": "uni-preset-vue",
  "version": "0.0.0",
  "scripts": {
    "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-jd": "uni -p mp-jd",
    "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-harmony": "uni -p mp-harmony",
    "dev:mp-weixin": "uni -p mp-weixin",
    "dev:mp-xhs": "uni -p mp-xhs",
    "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: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-jd": "uni build -p mp-jd",
    "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-harmony": "uni build -p mp-harmony",
    "build:mp-weixin": "uni build -p mp-weixin",
    "build:mp-xhs": "uni build -p mp-xhs",
    "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",
    "type-check": "vue-tsc --noEmit"
  },
  "dependencies": {
    "@dcloudio/uni-app": "3.0.0-5020620260917001",
    "@dcloudio/uni-app-harmony": "3.0.0-5020620260917001",
    "@dcloudio/uni-app-plus": "3.0.0-5020620260917001",
    "@dcloudio/uni-components": "3.0.0-5020620260917001",
    "@dcloudio/uni-h5": "3.0.0-5020620260917001",
    "@dcloudio/uni-mp-alipay": "3.0.0-5020620260917001",
    "@dcloudio/uni-mp-baidu": "3.0.0-5020620260917001",
    "@dcloudio/uni-mp-harmony": "3.0.0-5020620260917001",
    "@dcloudio/uni-mp-jd": "3.0.0-5020620260917001",
    "@dcloudio/uni-mp-kuaishou": "3.0.0-5020620260917001",
    "@dcloudio/uni-mp-lark": "3.0.0-5020620260917001",
    "@dcloudio/uni-mp-qq": "3.0.0-5020620260917001",
    "@dcloudio/uni-mp-toutiao": "3.0.0-5020620260917001",
    "@dcloudio/uni-mp-weixin": "3.0.0-5020620260917001",
    "@dcloudio/uni-mp-xhs": "3.0.0-5020620260917001",
    "@dcloudio/uni-quickapp-webview": "3.0.0-5020620260917001",
    "vue": "^3.4.21",
    "vue-i18n": "^9.1.9"
  },
  "devDependencies": {
    "@dcloudio/types": "^3.4.8",
    "@dcloudio/uni-automator": "3.0.0-5020620260917001",
    "@dcloudio/uni-cli-shared": "3.0.0-5020620260917001",
    "@dcloudio/uni-stacktracey": "3.0.0-5020620260917001",
    "@dcloudio/vite-plugin-uni": "3.0.0-5020620260917001",
    "@vue/tsconfig": "^0.1.3",
    "@vue/runtime-core": "^3.4.21",
    "typescript": "^4.9.4",
    "vite": "5.2.8",
    "vue-tsc": "^1.0.24"
  }
}

二、package.json 包版本更新

截至2026年10月29日,需要更新的最新包版本如下:

序号 包 版本 版本备注
1 vue 3.5.44 1. 内存占用减少56%
2. 响应式性能最高提升10倍
3. 模板解析速度提升2倍
4. 打包体积更小
5. 语法更新......
2 vue-i18n 11.4.16
3 vue-tsc 3.3.13 vue-tsc 暂不支持 TypeScript 7 (影响范畴:Scripts --> type-check),先去掉
4 typescript 7.0.2 go语言实现,性能提升10倍
5 vite 8.3.4 ❌️此版本在install时冲突❌️
6 sass 1.107.0 A pure JavaScript implementation of Sass.
7 sass-loader 17.1.0 Sass loader for webpack
8 sass-embedded 1.107.0 【 Embedded :嵌入式】 Node.js library that communicates with Embedded Dart Sass using the Embedded Sass protocol.
9 pinia 4.1.0 npm install pinia @vue/devtools-api
10 @vue/devtools-api 8.2.1 @vue/devtools-api 是 Vue DevTools 的官方插件 API 包,用于在开发期把自定义面板、状态检查、时间线等功能接入 DevTools,帮助调试 Vue 应用。官方文档:Plugins API

npm add -D @vue/devtools-api
11 pinia-plugin-persistedstate 4.7.1 pinia数据持久化到localStore, 依赖pinia
12 @vue/tsconfig 0.9.1
13 @vue/runtime-core 3.5.44

更新后的pakcage.json

{
  "name": "uni-preset-vue",
  "version": "0.0.0",
  "scripts": {
    "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-jd": "uni -p mp-jd",
    "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-harmony": "uni -p mp-harmony",
    "dev:mp-weixin": "uni -p mp-weixin",
    "dev:mp-xhs": "uni -p mp-xhs",
    "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: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-jd": "uni build -p mp-jd",
    "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-harmony": "uni build -p mp-harmony",
    "build:mp-weixin": "uni build -p mp-weixin",
    "build:mp-xhs": "uni build -p mp-xhs",
    "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",
    "type-check": "vue-tsc --noEmit"
  },
  "dependencies": {
    "@dcloudio/uni-app": "3.0.0-5020620260917001",
    "@dcloudio/uni-app-harmony": "3.0.0-5020620260917001",
    "@dcloudio/uni-app-plus": "3.0.0-5020620260917001",
    "@dcloudio/uni-components": "3.0.0-5020620260917001",
    "@dcloudio/uni-h5": "3.0.0-5020620260917001",
    "@dcloudio/uni-mp-alipay": "3.0.0-5020620260917001",
    "@dcloudio/uni-mp-baidu": "3.0.0-5020620260917001",
    "@dcloudio/uni-mp-harmony": "3.0.0-5020620260917001",
    "@dcloudio/uni-mp-jd": "3.0.0-5020620260917001",
    "@dcloudio/uni-mp-kuaishou": "3.0.0-5020620260917001",
    "@dcloudio/uni-mp-lark": "3.0.0-5020620260917001",
    "@dcloudio/uni-mp-qq": "3.0.0-5020620260917001",
    "@dcloudio/uni-mp-toutiao": "3.0.0-5020620260917001",
    "@dcloudio/uni-mp-weixin": "3.0.0-5020620260917001",
    "@dcloudio/uni-mp-xhs": "3.0.0-5020620260917001",
    "@dcloudio/uni-quickapp-webview": "3.0.0-5020620260917001",
    "pinia": "^4.1.0",
    "pinia-plugin-persistedstate": "^4.7.1",
    "vue": "^3.5.44",
    "vue-i18n": "^11.4.16"
  },
  "devDependencies": {
    "@dcloudio/types": "^3.4.8",
    "@dcloudio/uni-automator": "3.0.0-5020620260917001",
    "@dcloudio/uni-cli-shared": "3.0.0-5020620260917001",
    "@dcloudio/uni-stacktracey": "3.0.0-5020620260917001",
    "@dcloudio/vite-plugin-uni": "3.0.0-5020620260917001",
    "@vue/devtools-api": "^8.2.1",
    "@vue/runtime-core": "^3.5.44",
    "@vue/tsconfig": "^0.9.1",
    "sass-embedded": "1.107.0",
    "typescript": "^7.0.2",
    "vite": "5.2.8"
  }
}

npm包版本冲突

1. vite版本过高

npm install报错
image

将error文件喂给deepseek分析: C:\Users\mashi\AppData\Local\npm-cache_logs\2026-10-29T02_28_26_935Z-eresolve-report.txt

原因分析
你项目里安装的是 vite@8.3.4,但 @dcloudio/vite-plugin-uni 这个 uni-app 的 Vite 插件强制要求 vite@5.2.8(精确版本,不是范围)。 两者不兼容,npm 拒绝安装。

解决方案
降级 vite 到 5.2.8(最稳妥,推荐)

deepseek分析描述详情

2. vue版本冲突

  1. pinia-plugin-persistedstate@4.7.1要求的最低版本vue:3.5.11,与unic-cloud组件绑定的vue@3.4.21冲突
    原因:未显示依赖pinia导致的,将"pinia":"最新版本号" 加入 dependencies即可

UniApp 项目对 Vue 版本有较强锁定,不建议私自升级vue版本及相关插件版本
UniApp 项目对 Vue 版本有较强锁定,引入任何与 Vue 生态相关的插件(pinia、vue-router 等)时,都要留意其 peer 依赖是否被拉高到 Vue 3.5+。优先选择与 vue@3.4.x 匹配的插件版本,比强行升级 Vue 更稳妥。

3. vue-tsc 与 typescript7冲突

为什么 vue-tsc 不支持 TypeScript 7

TypeScript 7.0 虽然带来了基于 Go 的原生编译器,速度大幅提升,但它的编程式编译器 API(Compiler API)并没有随 7.0 一同提供,预计要到 7.1 才会稳定。而 vue-tsc(以及底层的 Volar)正是依赖这个 API 来对 .vue 文件进行类型检查的。因此,@volar/typescript 将 peer 依赖上限设为 <7,是已知且合理的限制。已有用户在 GitHub 上报告,强行搭配 vue-tsc 和 TypeScript 7.0 会直接报错找不到 typescript/lib/tsc 模块。

推荐的处理方式

最稳妥的做法是将项目的 TypeScript 版本降回 6.x,以满足 vue-tsc 的 peer 依赖要求。

posted @ 2026-10-29 10:14  超轶绝尘  阅读(6)  评论(0)    收藏  举报