1. 目录


  1. 开发规范
  2. 项目结构规范

1.1. 开发规范

开发人员需遵照开发规范执行

1.1.1. 基本原则

  1. 由于jquery在移动端的开发存在性能问题,页面不允许导入jquery库,如果已经习惯了jquery开发的,可以导入zepto库进行代替;
  2. 样式需进行兼容处理;
  3. UE交互保持一致性、UI风格保持一致性、代码风格保持一致性;
  4. 谨慎引入第三方前端库,引入时需要充分考虑性能、稳定性、可维护性和技能要求。

1.1.2. 页面开发规范

  1. 页面使用UTF-8编码
  2. 页面首屏数据量大小在1M以内,多余的部分需要使用异步导入的方式;
  3. 禁止ajax同步请求;
  4. 尽可能减少 div 嵌套;
  5. 样式代码不能使用CSS表达式;
  6. dom选择尽量使用ID选择;
  7. 所有的标签名必须小写;
  8. 所有的标签属性名必须小写;
  9. z-index的最高使用层级为49;
  10. 不要随意的使用position定位;
  11. link标签写在head标签内;
  12. script标签写在body标签结尾处;
  13. 国际化资源以中文简体资源为首选资源;
  14. 业务逻辑入口需放在cmp.ready回调里;
  15. 页面采用自适应屏幕宽度设置。

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. 代码结构

  1. html文件放到html文件夹;
  2. css文件放到css文件夹;
  3. js文件放到js文件夹;
  4. 图片文件放到img文件夹;
  5. 国际化资源文件放到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设置文件-->

results matching ""

    No results matching ""