Silentdoer

导航

通过控制台创建uni-app vue3+ts项目

第一步是要先把npm的源地址改成淘宝的,否则命令行创建时巨慢,且会报错,可以看文章:https://blog.csdn.net/weixin_43963309/article/details/121946080

通过这个命令来切换源:

npm config set registry https://registry.npm.taobao.org

通过这个命令来查看是否切换成功:

npm config get registry

好了以后然后通过命令创建uni-app项目:npx degit dcloudio/uni-preset-vue#vite-ts project-name

然后cd project-name,然后code . 用vscode打开此项目;

可以看到package.json里的是用的vuex而非pinia,所以我们先npm uninstall vuex,然后npm install pinia

然后npm install安装所有依赖;

然后通过这些命令来运行:(运行到微信小程序前提是已经安装了微信小程序开发工具【需要注册AppID】,app则是要有相关模拟器)

# 运行到 h5   
npm run dev:h5  
# 运行到 app   
npm run dev:app  
# 运行到 微信小程序  
npm run dev:mp-weixin  

运行到小程序后它不会自动启动微信小程序的开发测试工具,而是生成一个可以被微信小程序工具调试的输出目录,即dist/dev/mp-weixin目录;

然后我们主动打开微信小程序调试工具,通过导入这个项目的mp-weixin输出目录来调试:

点击导入后就会出现(需要加载一会儿):

至此uni-app cli创建项目和到微信小程序调试就OK了;

注意,后面仍然是在uni-app项目里改代码,自动编译重新生成微信小程序代码,然后微信小程序工具里reload生成的代码来调试的,而不是在上图微信小程序工具里直接改生成的代码;

posted on 2022-06-08 10:34  Silentdoer  阅读(793)  评论(0编辑  收藏  举报