vscode开发uniapp

130 阅读1分钟

插件准备

image.png

1.通过vue-cli安装

vue create -p dcloudio/uni-preset-vue my-project

有可能网络原因可以先用gitee的地址下载下来

git clone https://gitee.com/dcloud/uni-preset-vue.git

之后用本地生成,模板用默认即可

vue create -p ./uni-preset-vue my-project

2.添加sass包

yarn add sass sass-loader

3.迁移hbuilderr的代码

image.png 上面是hbuilder的,在文件夹打开,记得把git文件一起搞过去,因为其他人可能不想用vscode开发

复制到vscode的src目录下

image.png

这样其实结构上面就是你套一个环境。后面代码提交也是一模一样的。

4.运行项目

h5

yarn serve 

小程序

yarn dev:mp-weixin

image.png

需要运行后,再把这个目录用微信小程序工具打开即可

app

5.发布

小程序运行命令后在小程序工具点上传

yarn build:mp-weixin

6.代码提交

这里代码提交比较麻烦,你得用第三方工具提交。如果想用vscode得提交不行得,因为根目录在src下面。所以最好是有权力改项目组织架构成vue-cli的,这种在hbuilder打开也正常,否则不建议使用。