uniapp 开发规范
uniapp 开发规范
项目结构规范
- 目录结构清晰：遵循约定俗成的目录划分，如
pages存放页面，components存放组件，static存放静态资源。 - 命名规范：文件和文件夹使用小写字母、短横线连接（如
user-info.vue），避免特殊字符和空格。 - 分包加载：对大型项目使用分包机制，主包仅保留核心内容，子包按功能模块划分。
代码编写规范
-
Vue 单文件组件：
<template>中使用kebab-case标签名，如<user-card>。<script>中按data、props、methods等顺序组织代码，使用camelCase命名变量和方法。<style>推荐使用scoped避免样式污染。
-
JavaScript/TypeScript：
- 使用 ES6+ 语法，如
const/let替代var，箭头函数简化回调。 - 异步操作优先使用
async/await，避免回调地狱。 - 类型定义（TypeScript）明确，避免
any滥用。
- 使用 ES6+ 语法，如
-
CSS/SCSS：
- 采用 BEM 命名规范（如
.block__element--modifier）或模块化类名。 - 避免全局样式冲突，优先通过组件
scoped或 CSS Modules 实现隔离。
- 采用 BEM 命名规范（如
性能优化
- 图片资源：压缩图片体积，使用 CDN 或转 Base64 内联小图标。
- 按需加载：路由配置启用
lazyLoad，非首屏组件延迟加载。 - 数据缓存：合理使用
uni.setStorage缓存频繁访问的数据。
跨端兼容
- 条件编译：通过
#ifdef H5或#ifdef MP-WEIXIN区分平台逻辑。 - API 封装：对平台差异较大的 API 封装统一接口，如网络请求适配器。
- 样式适配：使用
rpx单位实现响应式布局，测试多端显示效果。
调试与发布
- 日志规范：生产环境移除
console.log，使用uni.$log封装调试工具。 - 版本管理：通过
manifest.json明确版本号，遵循语义化版本（如1.0.0）。 - 代码审查：提交前使用 ESLint 检查语法，确保符合团队约定规则。
安全建议
- 输入过滤：对用户输入进行 XSS 转义，避免直接渲染 HTML。
- HTTPS 请求：所有网络接口必须使用 HTTPS，敏感数据加密传输。
- 权限控制：客户端校验需与服务端配合，避免越权操作。
文档与协作
- 注释清晰：公共组件和复杂逻辑需添加注释，说明参数和返回值。
- README 维护：项目根目录提供开发环境配置、脚本命令等说明。
- Git 规范：分支命名如
feat/user-auth，提交信息遵循 Conventional Commits。
通过以上规范，可提升代码可维护性、团队协作效率和跨端稳定性。实际开发中需结合项目需求灵活调整。
