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不能看运行效果,但代码的修改与开发者工具是同步的,要在微信开发者工具中查看效果

相关推荐
FansyMeng2 小时前
VSCode配置anaconda
vscode·python
Anarkh_Lee7 小时前
在VSCode中使用MCP实现智能问数
数据库·ide·vscode·ai·编辑器·ai编程·数据库开发
2601_949804929 小时前
开源多商户商城源码最新版_适配微信小程序+H5+APP+PC多端
微信小程序·小程序
码云数智-大飞9 小时前
2026主流自助建站平台对比评测
微信小程序
一心赚狗粮的宇叔10 小时前
VScode常用扩展包&Node.js安装及npm包安装
vscode·npm·node.js·web
紫竹苑主10 小时前
VS Cose + PlatformIO +ESP32-S3 + ESPIDF开发环境安装卡壳持续等待问题解决
vscode·python·嵌入式硬件·物联网·硬件架构
西木九11 小时前
win11 vscode 本地 latex 编译(Elsevier举例)
vscode·latex·学术写作
2501_9339072112 小时前
上海本凡科技的微信小程序公司主要提供哪些服务?
科技·微信小程序·小程序
Sapphire~13 小时前
Linux-14 ubuntu 安装 vscode
linux·vscode·ubuntu
2601_9498049213 小时前
【全开源】西陆家政系统源码小程序(FastAdmin+ThinkPHP+原生微信小程序)
微信小程序·小程序