1. 目录
1.1. 开发规范
开发人员需遵照开发规范执行
1.1.1. 基本原则
- 由于jquery在移动端的开发存在性能问题,页面不允许导入jquery库,如果已经习惯了jquery开发的,可以导入zepto库进行代替;
- 样式需进行兼容处理;
- UE交互保持一致性、UI风格保持一致性、代码风格保持一致性;
- 谨慎引入第三方前端库,引入时需要充分考虑性能、稳定性、可维护性和技能要求。
1.1.2. 页面开发规范
- 页面使用UTF-8编码
- 页面首屏数据量大小在1M以内,多余的部分需要使用异步导入的方式;
- 禁止ajax同步请求;
- 尽可能减少 div 嵌套;
- 样式代码不能使用CSS表达式;
- dom选择尽量使用ID选择;
- 所有的标签名必须小写;
- 所有的标签属性名必须小写;
- z-index的最高使用层级为49;
- 不要随意的使用position定位;
- link标签写在head标签内;
- script标签写在body标签结尾处;
- 国际化资源以中文简体资源为首选资源;
- 业务逻辑入口需放在cmp.ready回调里;
- 页面采用自适应屏幕宽度设置。
Example
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
1.1.3. 代码结构
- html文件放到html文件夹;
- css文件放到css文件夹;
- js文件放到js文件夹;
- 图片文件放到img文件夹;
- 国际化资源文件放到i18n文件夹。
1.1.4. 命名
camel命名风格
1.2. 项目结构规范
project
      |----html                                  <!--html文件夹-->
            -- index.html
      |----js                                    <!--js文件夹-->
           -- index.js
      |----css                                   <!--css文件夹-->
           -- index.css
      |----img                                   <!--图片文件夹-->
      |----i18n                                  <!--国际化文件夹-->
           -- project_en.js
           -- project_zh_CN.js
           -- project_zh_TW.js
      |----s3scriptjspdata                       <!--S3编译文件夹-->
           -- project_m3_commandata.data
           -- project_wechat_commandata.data
           -- project_dingding_commandata.data
      -- manifest.json                            <!--模块配置文件-->
      -- newModule_m_api.s3js                     <!--模块消息穿透、门户待办穿透api设置文件-->