从零开始的微信小程序线上商城开发（一）

今天开始制作一款微信小程序，一方面是巩固所学，一方面也在查漏补缺，准备尽可能的将所有电商功能模块都做出来，首先是准备工作。

这是微信小程序开发文档，下载微信开发者工具，我的开发者工具版本为1.03.2006090（突然改了界面好不习惯），UI库我选择了Vant Weapp。准备就绪，出发！

1、新建项目

打开微信开发者工具，点击新建项目进入以下界面

• 项目名称：填写你的项目名称
• 目录：选择项目保存的路径
• AppID：填写appid，若无可使用测试号
• 开发模式：小程序
• 后端服务：我这里选择不使用云服务，因为还没有了解云开发

点击新建按钮进入以下界面

 这是微信官方的HelloWorld示例，项目包含以下部分：

• pages  存放页面文件
• utils  存放工具文件
• app.js  小程序启动逻辑
• app.json  小程序公共配置
• app.wxss  小程序公共样式表

├── app.js
├── app.json
├── app.wxss
├── pages
│   │── index
│   │   ├── index.wxml
│   │   ├── index.js
│   │   ├── index.json
│   │   └── index.wxss
│   └── logs
│       ├── logs.wxml
│       └── logs.js
└── utils

2、添加底部tab栏 

首先先下载两个图标，因为tabbar不支持网络图片，这里我选择去iconfont下载图标，建议尺寸为81px*81px。下载后在小程序根目录下新建static/img文件夹，把刚刚下载的图标存进img文件夹中。

接着配置tabbar，打开app.json，配置项如下：

属性	类型	必填	描述	最低版本
pages	string[]