开发方式

• 使用DCloud公司提供的HBuilderX来快速开发
• 使用脚手架来快速搭建和开发

  脚手架搭建项目

1. 全局安装

npm install -g [@vue](#)

1. 创建项目

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

1. 启动项目（微信小程序）

npm run dev:mp-weixin

1. 微信小程序开发者工具导入项目

a.下载微信小程序开发者工具
文档：https://developers.weixin.qq.com/miniprogram/dev/framework/quickstart/
b.点击‘+’号

c.导入项目 选择路径

安装语法提示插件vetur

目录结构

┌─components            uni-app组件目录
│  └─comp-a.vue         可复用的a组件
├─hybrid                存放本地网页的目录，详见
├─platforms             存放各平台专用页面的目录，详见
├─pages                 业务页面文件存放的目录
│  ├─index
│  │  └─index.vue       index页面
│  └─list
│     └─list.vue        list页面
├─static                存放应用引用静态资源（如图片、视频等）的目录，注意：静态资源只能存放于此
├─wxcomponents          存放小程序组件的目录，详见
├─main.js               Vue初始化入口文件
├─App.vue               应用配置，用来配置App全局样式以及监听 应用生命周期
├─manifest.json         配置应用名称、appid、logo、版本等打包信息
└─pages.json            配置页面路由、导航条、选项卡等页面类信息

使用sass语法

1. 安装依赖npm i node-sass sass-loader
2. 在style标签上加入属性

   <style lang = 'scss'>