VsCode开发uni-app
uni-app 是一个用 vue 语法来开发小程序、App、H5 的框架,其官方推荐的开发工具为 HBuilderX,使用起来有很好的开发体验。
CLI 工程
全局安装 vue-cli 3.x(如已安装请跳过此步骤)
1 |
|
通过 CLI 创建 uni-app 项目
1 |
|
此时,会提示选择项目模板,初次体验建议选择 hello uni-app 项目模板。
CLI 工程默认带了uni-app语法提示和5+App语法提示
安装组件
语法提示
1 |
|
代码块
从 github 下载 uni-app 代码块 ,放到项目目录下的 .vscode
目录即可拥有和 HBuilderX 一样的代码块。
HBuilderX 工程
HBuilderX 创建的工程默认不带 types 语法提示,在 vscode 中编辑的时候,可以自行安装
初始化
如已初始化跳过此步骤
1 |
|
语法提示
安装 uni-app 语法提示
1 |
|
另外,uni-app 项目下的 manifest.json、pages.json 等文件可以包含注释。vscode 里需要改用 jsonc 编辑器打开。
运行项目
1 |
|
发布项目
1 |
|
%PLATFORM%
可取值如下:
值 | 平台 |
---|---|
h5 | H5 |
mp-alipay | 支付宝小程序 |
mp-baidu | 百度小程序 |
mp-weixin | 微信小程序 |
mp-toutiao | 头条小程序 |
mp-qq | qq 小程序 |
其他配置
less-loader
1 |
|