微信小程序开发规范（初稿）

一、目录结构

├── app.js                          入口文件

├── app.json                      全局配置文件

├── app.wxss                     全局样式

├── assets                          静态资源文件

├── components                 公共组件

├── css                               

│   │   └── public.wxss        公共样式

├── pages                           页面资源                  

├── tools                             自定义工具类及第三方资源

│   ├── config.js                  自定义配置项 如：接口地址等

│   ├── http.js                      wx.request 二次封装 

├── project.config.json       小程序配置文件

└── sitemap.json                配置小程序及其页面是否允许被微信索引 详情

二、json 配置 规范

           参照官方 https://developers.weixin.qq.com/miniprogram/dev/framework/quickstart/code.html#JSON-%E9%85%8D%E7%BD%AE

二、 wxml  编码规范

            参照官方：https://developers.weixin.qq.com/miniprogram/dev/framework/quickstart/code.html#WXML-%E6%A8%A1%E6%9D%BF

三、 wxss规范(css)  规范

               wxss 命名规范

                       1.wxss class命名尽量使用英语，不要使用汉拼，并且有意义，

                        2.使用单词命名时不要缩写，除非非常有名的单词。

                        3.- 规则命名中，一律采用小写加中划线的方式，不允许使用大写字母或 _   例如（header-list）

                        4.不允许通过1、2、3等序号进行命名

                        5.避免class与id重名

                wxss 编写顺序

                       1.位置，定位，层级（position，top，bottom，left，right，z-index，display，float）

                       2.大小（width，height，padding，margin）

                       3.文字系列（font, line-height, letter-spacing, color- text-align）

                       4.背景（background，border）

                       5.其他（animation，transition）

               其它拓展 参照官方： https://developers.weixin.qq.com/miniprogram/dev/framework/quickstart/code.html#WXSS-%E6%A0%B7%E5%BC%8F

四、js规范   

                1.变量命名采用小驼峰命名法---即首字母小写，后每个单词首字母大写

                2.常量命名采用全字母大写命名，以便于与变量区分

                    常量  const  PI = 3.141592653   变量  let  name = ''

                3.函数命名使用小驼峰命名法，条件允许情况下请采用动词前缀方式，请保证函数命名语义化明确

                4.构造函数命名必须采用大驼峰命名法，即首字母必须大写

                5.注释

                    // 这是名称

                    let name = 'wsl'

               6.推荐使用对象直接创建对象，而非构造器创建

               7.判断

                   比较运算符,推荐使用 '===' 与 '!=='  

                   if 推荐不要简写，判断 非空时 “!变量”需要考虑变量不为数值0

                8.循环

                     若循环中需使用函数，请将函数定义在循环外部而非内部，这样可以避免函数的反复创建

                 其它拓展 参照官网 https://developers.weixin.qq.com/miniprogram/dev/framework/quickstart/code.html#JS-%E9%80%BB%E8%BE%91%E4%BA%A4%E4%BA%92

五、常用变量限制及验证

               1.名称字数限制 （推荐1-20）

               2.手机号，电话，邮箱验证（通用验证）

               3. 上传附件

                    图片：若无特殊要求，多选数量设置 9

                    视频：若无特殊要求，多选数量设置 9 

六、页面显示及功能交互通用

              1.文字超出容器需要进行 '...' 省略

              2.图片显示 无特殊要求时，按原图宽高比显示

              3..涉及数据处理功能按钮，增加防频繁点击处理

              4.增加小程序更新机制

              5.列表页面，增加上拉加载、下拉刷新功能

七、相关组件

            1.官方组件   https://developers.weixin.qq.com/miniprogram/dev/component/

            2.weui   UI库 https://weui.io/

八、小程序开发指南（官方）

              https://developers.weixin.qq.com/ebook?action=get_post_info&docid=0008aeea9a8978ab0086a685851c0a