小程序项目从Hbuilder转移到vscode步骤
小程序项目HbuilderX转移到vscode开发步骤
步骤总览
一、安装一个脚手架版本vue-cli@4，注意是@4版本的
npm install -g @vue/cli@4
二、在vue中创建一个uniapp项目，因为这个包是在GitHub上的，所以可能会导致下载失败
下载后的是uniapp的源码和一些vue的代码
vue create -p dcloudio/uni-preset-vue uniapp-testDemo(最后这个是项目的名称)
三、完成上面项目后就是一个简单的uniapp框架，可以直接运行，此时还需要安装一些必要的样式包 sass或者less等等
yarn add sass sass-loader npm i sass sass-loader
四、把HbuilderX的文件移动到vue-cli的src目录下
五、移动项目完成后，用命令启动
yran dev:mp-weixin
六、启动项目在微信开发者工具
第五步时已经运行打包了，所以我们只要需要把dist–dev–mp-weixin 这个路径在微信开发者工具打开即可
细节：
一、用yarn下载包时，先确定是否安装了yarn，前提是要有yarn才可以进行yarn的指令进行操作
二、如果出现scss报错，可进行scss的版本降级
三、因为是把uniapp在vscode开发，所以vscode是没有微信开发者工具那些api提示的，所以需要在vscode安装 微信开发者工具，和一些代码的提示插件
四、json文件注释的问题，通常情况下json文件是不允许注释的，否则就会报错，但是我们一定要注释的话怎么办呢？这时候就需要用到 JSON with Comments
五、git管理的工具，可以查看提交，切换分支，切换仓库地址等等，比较方便
Y9DQD-1658732908666)]
五、git管理的工具，可以查看提交，切换分支，切换仓库地址等等，比较方便
小程序项目从Hbuilder转移到vscode步骤相关推荐
- 【博学谷学习记录】超强总结，用心分享|软件测试课外拓展Ego微商小程序项目
目录 Ego微商小程序项目 1. Day01 + Day02 1.1 今日目标 1.2 开发者工具 1.3 熟悉Ego微信小程序项目 1.4 项目部署步骤 1.4.1 部署前的准备 1.4.2 小程序 ...
- 使用 HBuilder X 将微信 小程序 项目 打包
项目场景: 提示:这里简述项目相关背景: 使用 HBuilder X 将微信 小程序 项目 打包 问题描述 这里描述项目中遇到的问题:` 使用 HBuilder X 将微信 小程序 项目 打包 解决方 ...
- HBuilder X运行微信小程序项目至微信开发者工具失败
在HBuilder X中运行微信小程序项目时,此步于以下过程,无法进一步打开界面 解决方案:导入项目即可,但是需要注意导入项目的路径信息. 需要是当前项目unpackage==>dist==&g ...
- 2023年最新最全uniCloud入门学习，零基础入门到实战项目 uni-admin打造uniapp网页后端 微信支付宝抖音小程序后端 unicloud数据后台快速打造uniapp小程序项目
今天开始带着大家一起零基础学习uniCloud,在下面的课程中我们就简称uniCloud为cloud吧.我这里从零基础开始教大家,后面可以带大家简单的做一个实战项目.所以不用担心自己没有基础,跟着石头 ...
- 配置小程序项目的第一个页面—小程序入门与实战（五）
上一小节我们虽然构建了项目的目录,也配置了几个必要文件,但是我们的项目还是不能编译起来,我们还需要完善app.json.app.js.app.wxss这3个文件跟之前我们说的src/pages/ind ...
- 基于 uni-app 和 uni-cloud 小程序项目开发实战
基于 uni-app 和 uni-cloud 小程序项目开发实战 前言 一.技术栈 二.环境搭建 三.项目功能介绍 1.地图地点搜索及路线规划 2.uniCloud服务空间 3.AI识图 4.上拉框组 ...
- 在 WebStorm 中开发 uni-app - 用vue2实现手机APP(apk) + 微信小程序项目开发方案
主要是跟vue2相关的开发环境与框架. 本人选型方案 结合自身知识系统(vue2,webstorm),综上相关框架了解,选择了以下方案: 开发环境:HBuilder X + Webstorm 框 ...
- 微信小程序项目转uniapp踩坑日记
本文目录 一.前言 二.转换方式 三.后语 四.其他:node报错 1.包默认C盘存放,而不是安装目录E盘 2.正确的环境变量添加 3.npm install 命令报错 4.npm install - ...
- uni-app创建小程序项目并运行到微信开发者工具上@令狐张豪
在这直接说步骤 1. 创建uni-app小程序项目 2. 打开项目中的manifest.json文件进行配置 2.1 写入微信小程序AppID 2.2 打开HBuilder X 工具-设置 填写外部w ...
最新文章
- ViewHolder VS HolderView ?
- Zabbix监控华为交换机CPU、温度并显示到拓扑图
- IDEA配置java《算法》第四版环境（耗时6小时，总算配置成功了，希望能给大家一点帮助）
- 突发！这个操作系统竟比macOS还火
- CPU 硬盘性能到底相差多少
- shell写的彩色进度条
- Python 迭代器，错误、异常处理
- android fragment 嵌套,Fragment嵌套Fragment时遇到的那些坑
- 04737 c++ 自学考试2019版 第五章程序设计题 1
- reddit_Reddit如何大规模构建功能：采访其工程副总裁
- SQL中datetime和timestamp的区别
- 单片机定时器实验两位倒计时秒表_Proteus入门单片机（3）例程分析
- ubuntu14.04中mysql的安裝及utf8编码集配置
- Spring和Mybatis整合-mapper开发
- 全国计算机一级2021选择题,2021年度全国计算机一级考试选择题试题与详细答案.doc...
- android 华为摄像头权限_Android踩坑日记（一）：android7.0动态相机权限
- 周华健机器人演唱会_周华健伦敦花旦演唱会：歌声悠悠流过梦一样人生
- 小程序 - canvas绘制海报
- 计算机主板反复启动,主板无限重启怎么回事
- 数据分析能力的8个等级