02、微信小程序之 开发环境

教程简介

• 1、阅读范围

本篇教程适合新手阅读，老手直接略过

• 2、教程难度

  初级

1、小程序的开发环境

1、下载开发工具

• 1、开发工具有三个分别针对windows 64 、 windows 32 、 mac 三个平台来去下载工具，这没有什么好说的，然后一路安装即可。

对应的下载地址:mp.weixin.qq.com/debug/wxado…

• 2、新建一个Demo

这里假设你已经安装了小程序的开发环境，我们直接创建项目。

1、打开开发工具，开发工具长以下样子

注意，如果是首次打开的时候会让你扫描一下二维来确定登录开发者工具。并且只有添加项目这个选项。

2、点击添加项目按钮

3、点击添加项目按钮,此时项目就会创建成功了

到此为止我们的开发环境基本上就讲完了，这没有什么好说的，没有复杂的配置流程

2、小程序开发工具和项目结构

1、小程序的开发环境简介

从图可知，这基本上也没有什么说的，我们点点基本上就知道各个功能是干什么的，这里特别要说一点就是，开发工具现在支持ctrl+s保存自动刷新功能(以前是要重新编译一下才可以),再一个就是在调试环境下就是把chrome的调试功能集成了进来，我们可以快速的定位错误和查找问题。

2、小程序的项目结构

小程序的项目结构分为主体部分和页面部分，主体部分小程序必不可少的部分。

• 1、一个小程序主体部分由三个文件组成，必须放在项目的根目录，如下:

由图可以看出，小程序的主体部分由三部分组成，并且必须放在项目的根目录，其中样式表不是必须的。名字必须叫app.js,app.json,app.wxss，不能胡乱更改。

• 2、小程序的界面由四分部分组成

由图可知，小程序的页面由四部分组成，其中样式表和json文件不是必须的。

• 3、对应项目中的结构

3、推荐阅读

具体细节可以看官方的教程:mp.weixin.qq.com/debug/wxado…和mp.weixin.qq.com/debug/wxado…