前言
随着一个项目的开发的日益庞大,参与开发的人员也越来越多,这就出现了怎么样更好的协作的问题。当然一个好的代码规范是一个项目走向成功的基石。如果在开发中每个小伙伴都各行其事,那这个项目势必会出现各种问题,导致开发效率低下,后期维护特别麻烦等诸多问题。
因此,本篇内容给大家带来了以下几个常用的前端开发规范。让我们平时的开发更加高效,让写代码就如同写诗一般快乐、优雅~~
Vue 开发规范
身为一个vue的忠实粉丝,当然首先要推荐Vue开发中的规范。官网地址如下:
风格指南 | Vue3中文文档 - vuejs (vue3js.cn)
这里是官方的 Vue 特有代码的风格指南。如果在工程中使用 Vue,为了回避错误、小纠结和反模式,该指南是份不错的参考。不过我们也不确信风格指南的所有内容对于所有的团队或工程都是理想的。所以根据过去的经验、周边的技术栈、个人价值观做出有意义的偏差是可取的。
对于其绝大部分,我们也总体上避免就 JavaScript 或 HTML 的本身提出建议。我们不介意你是否使用分号或结尾的逗号。我们不介意你在 HTML attribute 中使用单引号还是双引号。不过当我们发现在 Vue 的情景下有帮助的特定模式时,也会存在例外。
最终,我们把所有的规则归为了四个大类:
- 优先级 A:必要的
- 优先级 B:强烈推荐
- 优先级 C:推荐
- 优先级 D:谨慎使用
如果你平时用vue开发项目,那么这篇文档是绝对不容错过的。要仔细阅读至少两遍才行哦~
京东凹凸实验室规范
京东凹凸实现室的规范是针对于前端开发的一种规范,不拘限于某个框架,笔者也是正在用的一种规范,非常好用。
前端代码规范
是由 凹凸实验室 整理的,基于 W3C、苹果开发者 等官方文档,并结合团队日常业务需求以及团队在日常开发过程中总结提炼出的经验而制定。官网地址如下:
概述 | Aotu.io - 前端代码规范
旨在增强团队开发协作、提高代码质量和打造开发基石的编码规范,主要有以下规范:
- HTML 规范
- 图片规范
- css 规范
- 命名规范
- js 规范
腾讯前端开发规范
先看一下首页写着的一句话:
代码千万行,安全第一行;前端不规范,运营两行泪
就可以看出一个好的代码规范是多么的重要,为了运营小伙伴的sm着想,也要做好规范。
官网地址如下:
TGideas文档库 (qq.com)
主要包含以下几个方面的规范:
- PC端专题快速上手
- 移动端专题快速上手
- 双端官网快速上手
阮一峰的ES6编程风格
阮一峰大大整理的 ES6的教程是非常好的,笔者在学习的时候也是把这个网址做为主要的参考网站,经常去这里查询一些知识点。强烈推荐新手看看。官网地址:
https://es6.ruanyifeng.com/
主要讲解了以下几个方面的规范:
- 块级作用域
- 字符串
- 解构赋值
- 对象
- 数组
- 函数
- Map 结构
- Class
- 模块
- ESLint 的使用
文末
最后再给大家推荐两款关于代码规范的 vscode 插件,eslint
和 prettier
。真的是谁用谁知道,那酸爽真的是~~哈哈