vscode开发微信小程序

下载插件

插件下载位置

1. 微信小程序开发工具

2. vscode weapp api

3. vscode wxml

4. vscode-wechat

创建项目

终端运行命令

cd 到要创建项目的目录执行命令:vue create -p dcloudio/uni-preset-vue test

test就是项目名称

选择默认模板,回车

出现下图这样就创建成功了

打开项目文件夹

选择刚才创建的项目文件,信任此项目

修改package.json文件,"serve": "npm run dev:mp-weixin",

运行项目

在终端cd 到项目文件中,运行项目

cd test

npm run serve

出现下图这样就运行成功了

微信开发者工具看效果

点击加号

填写信息

项目名称:test(自行修改)

目录:C:\Users\20446\WeChatProjects\test\dist\dev\mp-weixin(刚才创建的项目目录下的dist\dev\mp-weixin)

AppID:选择自己的appid

后端服务:不使用云服务

点击创建

出现下图这样就创建成功啦

vscode不能看运行效果,但代码的修改与开发者工具是同步的,要在微信开发者工具中查看效果

相关推荐
TunerT_TQ9 小时前
Valhalla 静态工程审阅 #009|Continue 源码证据驱动评测【大厂开源基础设施特辑】
vscode·测试工具·开源·llm·github·jetbrains·ai编程助手
时时三省11 小时前
VScode 智能插件安装
ide·vscode·编辑器
眞bilibili14 小时前
如何快速无缝的从 vscode 转向AI编辑器 cursor、kiro、trae 等
人工智能·vscode·编辑器
jerryinwuhan15 小时前
VScode 安装opencode
ide·vscode·编辑器
海纳百川·纳海川2 天前
租房行业数字化:换个思路解决“老问题”
大数据·微信小程序·小程序
谢斯2 天前
[vscode] 使用unity打开vscode的取消.csproj的显示
ide·vscode·unity
2501_916007472 天前
SwiftUI 声明式语法与 Xcode 预览功能详解
ide·vscode·ios·swiftui·个人开发·xcode·敏捷流程
爱就是恒久忍耐2 天前
使用VSCode开发STM32 (通用版本)
ide·vscode·stm32
FlightYe3 天前
音视频修炼之视频基础(一):视频基础理论
android·c++·vscode·音视频·androidx·android runtime
我要见SA姐13 天前
VsCode 使用指南(配置 + 美化)
ide·vscode·编辑器