目录规范

  1. ```
  2. .
  3. ├── App.Vue                         # 主应用组件
  4. ├── pages.json                      # 页面路由配置
  5. ├── manifest.json                   # uni配置页
  6. ├── main.js                         # 入口文件
  7. ├── package.json                    # 引入第三方npm包
  8. ├── common                          # 公共 方法 工具等
  9. │   └── utils                       # 公共 工具
  10. │   └── http-client                 # 公共 请求方法
  11. │   └── ...
  12. ├── components                      # 公共 UI 组件
  13. │   └── ...
  14. ├─- hybrid                App端存放本地html文件的目录
  15. ├─- platforms             存放各平台专用页面的目录，详见
  16. ├── config                          # 公共 设置
  17. │   └── api.json                  # 公共 接口设置
  18. │   └── app.json                  # 公共 url 平台 等设置
  19. │   └── ...
  20. ├── pages                           # 页面
  21. │   ├── login    
  22. │   ├── addressbook
  23. |   |-- my
  24. |   |-- workbench
  25. |   |-- message
  26. │   └── ... 
  27. |-- subpkgs
  28.     |-- xiaocheng
  29.       |-- senhuo
  30.       |-- xxx
  31. ├── plugins                         # 第三方工具
  32. │   └── ...
  33. ├── api                     
  34. │   └── user.js                
  35. │   └── login.js                 
  36. │   └── ...
  37. ├── static                          # 静态资源
  38. │   └── tab                         # tab栏图片
  39. │   └── ...
  40. ├── store                           # 状态管理
  41. │   └── modules                     
  42. │       └── app                     # 应用级别状态
  43. │       └── auth                    # 登陆级别状态
  44. │   └── ...
  45. ├── styles                          # 样式管理
  46. │   └── iconfont                    # 字体icon
  47. │   └── animation                   # 动画样式
  48. │   └── base                        # 基础公共样式
  49. │   └── ...
  50. ├── mock-server                     # 数据模块服务
  1. <a name="YQpZQ"></a>
  2. ## 代码规范
  4. - 组件命名
  6. 首先创建同名目录，组件名称均使用小写字母加 - 拼接，例如<br />address-book.vue
  8. - 组件及页面使用 .vue 文件开发
  9. - js,css等文件命名均使用小写字母加 - 拼接
  10. - 代码格式化
  12. 在 hbuilder 中安装 prettier 进行代码格式化<br />![image.png](https://cdn.nlark.com/yuque/0/2022/png/22915529/1649920491258-39a1f20d-379c-4b14-bea5-ed73aef3cadc.png#clientId=u45ae1d5b-da5f-4&crop=0&crop=0&crop=1&crop=1&from=paste&height=377&id=ue1e33b05&margin=%5Bobject%20Object%5D&name=image.png&originHeight=754&originWidth=715&originalType=binary&ratio=1&rotation=0&showTitle=false&size=91487&status=done&style=none&taskId=u98a79a6b-7e14-49ff-8305-86df6e5fb1c&title=&width=357.5)<br />![image.png](https://cdn.nlark.com/yuque/0/2022/png/22915529/1649920519031-282598fd-d087-48a6-9729-5f9256b680fe.png#clientId=u45ae1d5b-da5f-4&crop=0&crop=0&crop=1&crop=1&from=paste&height=184&id=ubf726572&margin=%5Bobject%20Object%5D&name=image.png&originHeight=368&originWidth=735&originalType=binary&ratio=1&rotation=0&showTitle=false&size=52849&status=done&style=none&taskId=u929da7a3-4df8-4170-83a1-4ca1d9f2341&title=&width=367.5)
  13. ```javascript
  14. module.exports = {
  15.     printWidth: 180,
  16.     semi: true,
  17.     tabWidth: 4,
  18.     useTabs: false,
  19.     singleQuote: true,
  20.     trailingComma: "none",
  21.     bracketSpacing: true,
  22.     htmlWhitespaceSensitivity: "ignore",
  23.     parsers: {
  24.         ".jsx": "flow",
  25.         ".scss": "scss",
  26.         ".ts": "typescript",
  27.         ".less": "css",
  28.         ".vue": "vue",
  29.         ".nvue": "vue",
  30.         ".ux": "vue",
  31.         ".yml": "yaml",
  32.     }
  33. }