前言
代码规范参考借鉴自各个团队规范,提供肉联帮前端团队规范。
基本规范
命名规范
命名分类
camelCase
(驼峰式,也叫小驼峰命名,e.g. userInfo
)PascalCase
(帕斯卡命名式,也叫大驼峰命名,e.g. UserInfo
)kebab-case
(短横线连接式,e.g. user-info
)snake_case
(下划线连接式,e.g. user_info
)
项目命名
全部采用小写方式, 以下划线分隔。 例:snake_case
目录命名
组件目录使用PascalCase
,其他目录统一使用kebab-case
风格
HTML命名
单数复数使用kebab_case.js
风格
CSS命名
统一使用snake_case.css
HTML命名
统一使用snake_case.html
HTML 规范
语法标准
-
缩进使用 tab(2 个空格);
-
嵌套的节点应该缩进;
-
在属性上,使用双引号,不要使用单引号;
-
属性名全小写,用中划线(-)做分隔符;
-
要在自动闭合标签结尾处使用斜线;
<!DOCTYPE html>
<html>
<head>
<title>Page title</title>
</head>
<body>
<img src="images/image.png" alt="Image" />
<!-- 属性名全小写,用中划线(-)做分隔符 -->
<h1 class="hello-world">Hello, world!</h1>
</body>
</html>
规定字符编码
通过声明一个明确的字符编码,让浏览器轻松、快速的确定适合网页内容的渲染方式,通常指定为'UTF-8'。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
</head>
...
</html>
减少标签数量
<!-- bad -->
<span class="avatar">
<img src="..." />
</span>
<!-- good -->
<img class="avatar" src="..." />
语义化标签
html 的标签能使用语义化的,尽量使用语义化标签,避免一个页面都是 div 或者 p 标签
<!-- bad -->
<div>
<p></p>
</div>
<!-- good -->
<header></header>
<footer></footer>
CSS规范
缩进
使用 tab 缩进(2 个空格)
.element {
border-radius: 10px;
width: 50px;
height: 50px;
}
分号
每个声明结束都要加分号
.element {
border-radius: 10px;
width: 50px;
height: 50px;
}
注释
注释统一使用 /* */
/* 这里是注释 */
.element {
width: 50px;
height: 50px;
}
引号
-
url 的内容要用引号
-
属性选择器中的属性值需要引号
.element:after {
content: "";
background-image: url("logo.png");
}
li[data-type="single"] {
...;
}
命名
-
类名使用小写字母,以中划线分隔
-
id 采用驼峰式命名
/* class */
.element-content {
...;
}
/* id */
#myDialog {
...;
}
JavaScript 规范
缩进
使用 tab 缩进(2 个空格)
if (x < y) {
x += 10;
} else {
x += 1;
}
变量命名
- 变量采用驼峰式命名
camelCase
- 常量使用全大写,用下划线连接
- 构造函数和Class采用
PascalCase
var thisIsMyName;
var MAX_COUNT = 10;
function Person(name) {
this.name = name;
}
Class Person {
}
变量声明
一个函数作用域中所有的变量声明尽量提到函数首部。优先使用块级变量let
和 const
,如无需修改的常量使用const
单行长度
单行长度不得超过 100,超过部分需要换行
分号
统一要加分号。
空格
- 三元运算符'?:'前后
- 逗号后必须要有空格
- 代码块'{'前
- 下列关键字前:else, while, catch, finally
- 下列关键字后:if, else, for, while, do, switch, case, try,catch, finally, with, return, typeof
- 单行注释'//'后(若单行注释和代码同行,则'//'前也需要),多行注释'*'后
- 对象的属性值前
- for 循环,分号后留有一个空格,前置条件如果有多个,逗号后留一个空格
- 无论是函数声明还是函数表达式,'{'前一定要有空格
- 函数的参数之间
例:
// not good
var a = {
b : 1
};
// good
var a = {
b: 1
};
// not good
++x;
y++;
z = x ? 1:2;
// good
++x;
y++;
z = x ? 1 : 2;
// not good
var a = [ 1, 2 ];
// good
var a = [1, 2];
// good
var doSomething = function(a, b, c) {
// do something
};
// good
doSomething(item);
// not good
for (let i = 0;i < 6;i++) {
x++;
}
// good
for (let i = 0; i < 6; i++) {
x++;
}
空行
- 变量声明后(当变量声明在代码块的最后一行时,则无需空行)
- 注释前(当注释在代码块的第一行时,则无需空行)
- 定义函数前
- 文件最后保留一个空行
var x = 1;
// 注释前要有空行
if (x >= 1) {
var y = x + 1;
}
function test () {
...
}
换行
-
代码块'{'后和'}'前
-
变量赋值后
// good
var a = {
b: 1,
c: 2
};
x = y ? 1 : 2;
// good
if (condition) {
...
} else {
...
}
try {
...
} catch (e) {
...
} finally {
...
}
// good
function test() {
...
}
// good
var a,foo = 7,
b, c, bar = 8;
注释
单行注释
-
注释单独一行的情况下,注释的//后面要跟一个空格
-
注释如果和代码同一行,代码分号结束后,要跟一个空格,注释的//后也要跟一个空格
// 调用函数
foo();
var maxCount = 10; // 这是一个变量
多行注释
多行注释使用下面这种形式:
/**
* 代码注释1
* 代码注释2
*/
多行注释建议在以下几种情况使用:
-
难于理解的代码段
-
可能存在错误的代码段
-
业务逻辑强相关的代码
函数注释
复杂的函数,所有类,都必须进行函数注释,函数注释使用业界统一的规范,方便后续使用 jsdoc 生成文档。最好配置VSCode自动生成模板
例:
/**
* @description 函数描述的 必填
* @param id {Number} 传入需要获取名称的人物id 参数必填
* @return {String} 返回的姓名 返回值必填,空为void
* @author shi 2015/07/21 作者可选
* @version 1.1.0 可以不写 版本可选
* @example 示例代码,可选
*/
function getTaskName(id) {
let name = "test";
return name;
}
引号
最外层统一使用单引号,除非字符串嵌套的情况使用双引号。
var y = 'foo',
z = '<div id="test"></div>';
对象,数组
-
对象属性名不需要加引号,如对象属性名是中划线命名的需要加引号(
eslint
的rules
) -
对象以缩进的形式书写,不要写在一行(单个属性可以写一行,
es6
导入方法时可以使用单行); -
数组、对象最后不要有逗号。
// good
var a = {
b: 1,
c: 2
};
括号
下列关键字后必须有大括号(即使代码块的内容只有一行):if
, else
, for
, while
, do
, switch
, try
, catch
, finally
, with
。
// not good
if (condition) doSomething();
// good
if (condition) {
doSomething();
}
undefined
永远不要直接使用 undefined 进行变量判断;
使用 typeof 和字符串'undefined'对变量进行判断。
// not good
if (person === undefined) {
...
}
// good
if (typeof person === 'undefined') {
...
}
不允许存在多层嵌套的条件判断和循环(最多三层)(重点强调⭐)
条件判断能使用三目运算符和逻辑运算符解决的,就不要使用条件判断,但是谨记不要写太长的三目运算符。
// bad
if (x === 10) {
return 'valid';
} else {
return 'invalid';
}
// good
return x === 10 ? 'valid' : 'invalid';
// bad
if (!x) {
if (!y) {
x = 1;
} else {
x = y;
}
}
// good
x = x || y || 1;
Vue规范
目录、文件、组件命名规范
1. 目录
目录统一使用kebab-case
风格
2. views下的文件
-
js类文件使用
PascalCase
,如UserInfo.js
-
其他资源文件统一使用
kebab-cas
e风格,如user-detail.js
,user-detail.css
,user-avatar.png
3. 组件文件
- 命名遵循
PascalCase
约定。 组件文件名除index.vue
之外,一律采用PascalCase
(大驼峰)写法。原因是引入组件时,组件的变量通常用PascalCase
格式,以区别于一般变量。组件文件名与变量名一致,方便对应。
import UserBook from './user/UserBook'
-
组件名应该始终是多个单词的,根组件 App 除外 html元素都是单个单词的(如
<article>
,<header>
),为了区分组件和一般html
元素,组件由多个单词组成,如BookItem.vue
,单独的Book.vue
不推荐。 -
组件使用遵循
kebab-case
约定 在页面中使用组件需要前后闭合,并以短线分隔,如:
<user-book></user-book>
<user-book />
开发规范
文件结构
- 基本结构
顺序:template
-> script
-> style
。一个组件尽量不要超过200行,页面包含独立部分时尽量分离成子组件。页面应该由各个小组件组成
<template>
<div>
<component-a />
<component-b />
<component-c />
</div>
</template>
<script>
export default {
components: {},
data() {
return {};
},
created(){},
methods: {},
};
</script>
<!-- 声明语言,并且添加scoped -->
<style lang="scss" scoped>...</style>
- 组件/实例的选项顺序
- name (全局引用)
- components (模板依赖)
- directives ...
- filters ...
- mixins (组合)
- props (接口)
- data (本地状态属性)
- computed ...
- watch (响应回调)
- created (生命周期函数)
- mounted ...
- methods (实例属性)
Vue Router 规范
- router path采用
kebab-case
格式。
用下划线(如:
/user_info
)或camelCase
(如:/userInfo
)的单词被当成一个单词,搜索引擎无法区分语义。
- router name采用
kebabCase
格式。
// bad
{
path: '/user_info', // user_info当成一个单词
name: 'UserInfo',
component: UserInfo,
meta: {
title: ' - 用户',
desc: ''
}
},
// good
{
path: '/user-info', // 能解析成user info
name: 'UserInfo',
component: UserInfo,
meta: {
title: ' - 用户',
desc: ''
}
组件开发规范
1. 注册组件
注册组件的时候,全部使用 PascalCase
格式。
import UserBook from './user/UserBook'
2. props 命名规范
- 在声明
prop
的时候,其命名应该始终使用camelCase
,而在模板中应该始终使用kebab-case
<welcome-message greeting-text="hi"></welcome-message>
<script>
props: {
greetingText: String;
}
</script>
-
prop定义应该尽量详细
1.申明类型type(必填)
2.提供默认值(必填
3.校验类型(可选)
// bad 这样做只有开发原型系统时可以接受
props: ['status']
// good
props: {
status: {
type: String,
required: true,
default: ''
}
}
}
methods 命名规范
- 驼峰式命名
camelCase
,操作性函数统一使用动词或者动词+名词形式
jumpPage() {
}
openCarInfoDialog () {
}
- 请求数据方法,以 data 结尾
getListData () {
}
postFormData () {
}
- 注: 尽量使用常用单词开头(set、get、go、can、has、is)
附: 函数方法常用的动词:
get 获取/set 设置,
add 增加/remove 删除
create 创建/destory 移除
start 启动/stop 停止
open 打开/close 关闭,
read 读取/write 写入
load 载入/save 保存,
create 创建/destroy 销毁
begin 开始/end 结束,
backup 备份/restore 恢复
import 导入/export 导出,
split 分割/merge 合并
inject 注入/extract 提取,
attach 附着/detach 脱离
bind 绑定/separate 分离,
view 查看/browse 浏览
edit 编辑/modify 修改,
select 选取/mark 标记
copy 复制/paste 粘贴,
undo 撤销/redo 重做
insert 插入/delete 移除,
add 加入/append 添加
clean 清理/clear 清除,
index 索引/sort 排序
find 查找/search 搜索,
increase 增加/decrease 减少
play 播放/pause 暂停,
launch 启动/run 运行
compile 编译/execute 执行,
debug 调试/trace 跟踪
observe 观察/listen 监听,
build 构建/publish 发布
input 输入/output 输出,
encode 编码/decode 解码
encrypt 加密/decrypt 解密,
compress 压缩/decompress 解压缩
pack 打包/unpack 解包,
parse 解析/emit 生成
connect 连接/disconnect 断开,
send 发送/receive 接收
download 下载/upload 上传,
refresh 刷新/synchronize 同步
update 更新/revert 复原,
lock 锁定/unlock 解锁
check out 签出/check in 签入,
submit 提交/commit 交付
push 推/pull 拉,
expand 展开/collapse 折叠
begin 起始/end 结束,
start 开始/finish 完成
enter 进入/exit 退出,
abort 放弃/quit 离开
obsolete 废弃/depreciate 废旧,
collect 收集/aggregate 聚集
多个属性的标签元素规范
<!-- bad -->
<img src="https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-user-assets/2020/4/27/171bab9e9687bb00~tplv-t2oaga2asx-image.image" alt="Vue Logo">
<my-component foo="fooattribute" bar="barattribute" baz="bazattribute"></my-component>
<!-- good -->
<img
src="https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-user-assets/2020/4/27/171bab9e9687bb00~tplv-t2oaga2asx-image.image"
alt="Vue Logo"
>
<my-component
foo="fooattribute"
bar="barattribute"
baz="bazattribute"
>
</my-component>
元素属性的顺序
原生属性放前面,指令放后面
- class
- id,ref
- name
- data-*
- src, for, type, href,value,max-length,max,min,pattern
- title, alt,placeholder
- aria-*, role
- required,readonly,disabled
- is
- v-for
- key
- v-if
- v-else-if
- v-else
- v-show
- v-cloak
- v-pre
- v-once
- v-model
- v-bind,:
- v-on,@
- v-html
- v-text
指令规范
- 指令有缩写则一律采用缩写形式
// bad
v-bind:code="code"
v-on:click="getUserData"
// good
:code="code"
@click="getUserData"
- v-for 循环必须加上 key 属性,在整个 for 循环中 key 需要唯一,添加key可提高性能
<!-- bad -->
<ul>
<li v-for="todo in todos">
{{ todo.text }}
</li>
</ul>
<!-- good -->
<ul>
<li v-for="todo in todos" :key="todo.id">
{{ todo.text }}
</li>
</ul>
- 避免 v-if 和 v-for 同时用在一个元素上(性能问题)
出现这样的需求,有两种解决方案:
1.将数据替换为一个计算属性,让其返回过滤后的列表
<!-- bad -->
<ul>
<li v-for="user in users" v-if="user.isActive" :key="user.id">
{{ user.name }}
</li>
</ul>
<!-- good -->
<ul>
<li v-for="user in activeUsers" :key="user.id">
{{ user.name }}
</li>
</ul>
<script>
computed: {
activeUsers: function () {
return this.users.filter(function (user) {
return user.isActive
})
}
}
</script>
2.将 v-if 移动至容器元素上 (比如 ul, ol)
<!-- bad -->
<ul>
<li v-for="user in users" v-if="shouldShowUsers" :key="user.id">
{{ user.name }}
</li>
</ul>
<!-- good -->
<ul v-if="shouldShowUsers">
<li v-for="user in users" :key="user.id">
{{ user.name }}
</li>
</ul>
SASS规范
语法选用
SASS有两种语法格式,一种是 SCSS (Sassy CSS),另一种是缩进格式(Indented Syntax),有时称之为 Sass。
团队约定
考虑到 SCSS 语法对 CSS 语法友好的兼容性和扩展性,我们在使用 SASS 编写样式的时候,统一使用 SCSS 语法
注释
SASS支持 CSS 标准的多行注释 /* */,同时也支持单行注释 //。
-
多行注释在使用非 Compressed 模式进行编译后的输出文件中会保留下来,单行注释 // 侧会被移除
-
多行注释和单行注释在 SASS 编译后输出的压缩 CSS 文件都会被移除
-
当多行注释内容第一个字符是感叹号 “!” 的时候,即 /*! */,SASS 无论用哪一种编译方式编译注释都会保留
-
注释内容可以加入 SASS 变量
团队约定
-
全部遵循 CSS 注释规范
-
不使用 /*! */ 注释方式
-
注释内不放 SASS 变量
@charset "UTF-8";
/**
* @desc File Info
* @author liqinuo
* @date 2015-10-10
*/
/* Module A
----------------------------------------------------------------*/
.mod_a {}
/* module A logo */
.mod_a_logo {}
/* module A nav */
.mod_a_nav {}
/* Module B
----------------------------------------------------------------*/
.mod_b {}
/* module B logo */
.mod_b_logo {}
/* module B nav */
.mod_b_nav {}
嵌套规范
选择器嵌套
/* CSS */
.jdc {}
body .jdc {}
/* SCSS */
.jdc {
body & {}
}
属性嵌套
/* CSS */
.jdc {
background-color: red;
background-repeat: no-repeat;
background-image: url(/img/icon.png);
background-position: 0 0;
}
/* SCSS */
.jdc {
background: {
color: red;
repeat: no-repeat;
image: url(/img/icon.png);
position: 0 0;
}
}
变量
可复用属性尽量抽离为页面变量,易于统一维护
// CSS
.jdc {
color: red;
border-color: red;
}
// SCSS
$color: red;
.jdc {
color: $color;
border-color: $color;
}
混合(mixin)
根据功能定义模块,然后在需要使用的地方通过 @include
调用,避免编码时重复输入代码段
// CSS
.jdc_1 {
-webkit-border-radius: 5px;
border-radius: 5px;
}
.jdc_2 {
-webkit-border-radius: 10px;
border-radius: 10px;
}
// SCSS
@mixin radius($radius:5px) {
-webkit-border-radius: $radius;
border-radius: $radius;
}
.jdc_1 {
@include radius; //参数使用默认值
}
.jdc_2 {
@include radius(10px);
}
// CSS
.jdc_1 {
background: url(/img/icon.png) no-repeat -10px 0;
}
.jdc_2 {
background: url(/img/icon.png) no-repeat -20px 0;
}
// SCSS
@mixin icon($x:0, $y:0) {
background: url(/img/icon.png) no-repeat $x, $y;
}
.jdc_1 {
@include icon(-10px, 0);
}
.jdc_2 {
@include icon(-20px, 0);
}
占位选择器 %
如果不调用则不会有任何多余的 css 文件,占位选择器以 % 标识定义,通过 @extend 调用
//scss
%borderbox {
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.jdc {
@extend %borderbox;
}
extend 继承
可以继承复用公共的属性
// CSS
.jdc_1 {
font-size: 12px;
color: red;
}
.jdc_2 {
font-size: 12px;
color: red;
font-weight: bold;
}
// SCSS
.jdc_1 {
font-size: 12px;
color: red;
}
.jdc_2 {
@extend .jdc_1;
font-weight: bold;
}
// 或者
%font_red {
font-size: 12px;
color: red;
}
.jdc_1 {
@extend %font_red;
}
.jdc_2 {
@extend %font_red;
font-weight: bold;
}
for 循环
// CSS
.jdc_1 {background-position: 0 -20px;}
.jdc_2 {background-position: 0 -40px;}
.jdc_3 {background-position: 0 -60px;}
// SCSS
@for $i from 1 through 3 {
.jdc_#{$i} {
background-position: 0 (-20px) * $i;
}
}
注意: #{} 是连接符,变量连接使用时需要依赖
each 循环
// CSS
.jdc_list {
background-image: url(/img/jdc_list.png);
}
.jdc_detail {
background-image: url(/img/jdc_detail.png);
}
// SCSS
@each $name in list, detail {
.jdc_#{$name} {
background-image: url(/img/jdc_#{$name}.png);
}
}
// CSS
.jdc_list {
background-image: url(/img/jdc_list.png);
background-color: red;
}
.jdc_detail {
background-image: url(/img/jdc_detail.png);
background-color: blue;
}
// SCSS
@each $name, $color in (list, red), (detail, blue) {
.jdc_#{$name} {
background-image: url(/img/jdc_#{$name}.png);
background-color: $color;
}
}
function 函数
@function pxToRem($px) {
@return $px / 10px * 1rem;
}
.jdc {
font-size: pxToRem(12px);
}
运算规范
运算符之间空出一个空格
.jdc {
width: 100px - 50px;
height: 30px / 5;
}
注意: 运算单位,单位同时参与运算,所以 10px 不等于 10,乘除运算时需要特别注意
// 正确的运算格式
.jdc {
width: 100px - 50px;
width: 100px + 50px;
width: 100px * 2;
width: 100px / 2;
}
小程序规范
目录、文件、组件命名规范
1. 目录
目录统一使用kebab-case
风格
2. page下的文件
-
js类文件使用
PascalCase
,如UserInfo.js
-
其他资源文件统一使用
kebab-case
风格,如user-detail.js
,user-detail.css
,user-avatar.png
3. 组件文件
- 命名遵循
PascalCase
约定。 组件文件名除index.vue
之外,一律采用PascalCase
(大驼峰)写法。原因是引入组件时,组件的变量通常用PascalCase
格式,以区别于一般变量。组件文件名与变量名一致,方便对应。
"usingComponents": {
"select-store-dialog": "../login/components/SelectStoreDialog/index"
}
-
组件名应该始终是多个单词的,组件由多个单词组成,如
BookItem
,单独的Book
不推荐。 -
组件使用遵循
kebab-case
约定 在页面中使用组件需要前后闭合,并以短线分隔,如:
<user-book></user-book>
<user-book />
组件的选项顺序
页面组件
- data (数据)
- 生命周期函数 (onLoad等)
- 各类方法 (methods)
自定义组件
- properties (需要传得数据)
- data (数据)
- 组件钩子函数 (attached等)
- 页面钩子函数 (show等)
- 各类方法 (methods)
组件开发规范
1. 注册组件
注册组件的时候,全部使用 PascalCase
格式。
"usingComponents": {
"select-store-dialog": "../login/components/SelectStoreDialog/index"
}
2. properties 命名规范
- 在声明
properties
的时候,其命名应该始终使用camelCase
,而在模板中应该始终使用kebab-case
<!--wxml-->
<welcome-message greeting-text="hi"></welcome-message>
-
properties定义应该尽量详细
1.申明类型type(必填)
2.提供默认值(必填)
/**
* 组件的属性列表
*/
properties: {
content:{
type: Object,
value: {}
}
}
methods 命名规范
- 驼峰式命名
camelCase
,操作性函数统一使用动词或者动词+名词形式
jumpPage() {
}
openCarInfoDialog () {
}
- 请求数据方法,以 data 结尾
getListData () {
}
postFormData () {
}
- 注: 尽量使用常用单词开头(set、get、go、can、has、is)
附: 函数方法常用的动词:
get 获取/set 设置,
add 增加/remove 删除
create 创建/destory 移除
start 启动/stop 停止
open 打开/close 关闭,
read 读取/write 写入
load 载入/save 保存,
create 创建/destroy 销毁
begin 开始/end 结束,
backup 备份/restore 恢复
import 导入/export 导出,
split 分割/merge 合并
inject 注入/extract 提取,
attach 附着/detach 脱离
bind 绑定/separate 分离,
view 查看/browse 浏览
edit 编辑/modify 修改,
select 选取/mark 标记
copy 复制/paste 粘贴,
undo 撤销/redo 重做
insert 插入/delete 移除,
add 加入/append 添加
clean 清理/clear 清除,
index 索引/sort 排序
find 查找/search 搜索,
increase 增加/decrease 减少
play 播放/pause 暂停,
launch 启动/run 运行
compile 编译/execute 执行,
debug 调试/trace 跟踪
observe 观察/listen 监听,
build 构建/publish 发布
input 输入/output 输出,
encode 编码/decode 解码
encrypt 加密/decrypt 解密,
compress 压缩/decompress 解压缩
pack 打包/unpack 解包,
parse 解析/emit 生成
connect 连接/disconnect 断开,
send 发送/receive 接收
download 下载/upload 上传,
refresh 刷新/synchronize 同步
update 更新/revert 复原,
lock 锁定/unlock 解锁
check out 签出/check in 签入,
submit 提交/commit 交付
push 推/pull 拉,
expand 展开/collapse 折叠
begin 起始/end 结束,
start 开始/finish 完成
enter 进入/exit 退出,
abort 放弃/quit 离开
obsolete 废弃/depreciate 废旧,
collect 收集/aggregate 聚集
多个属性的标签元素规范
<!-- bad -->
<image src="https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-user-assets/2020/4/27/171bab9e9687bb00~tplv-t2oaga2asx-image.image" class="image-class" />
<my-component foo="fooattribute" bar="barattribute" baz="bazattribute"></my-component>
<!-- good -->
<image
src="https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-user-assets/2020/4/27/171bab9e9687bb00~tplv-t2oaga2asx-image.image"
class="image-class"
>
<my-component
foo="fooattribute"
bar="barattribute"
baz="bazattribute"
>
</my-component>
元素属性的顺序
官方属性放前面,自定义属性放后面,然后指令最后
- class
- id
- src
- data-*
- wx:for
- bind:tap
...
相关参考团队
主要参考团队规范
pdf下载
链接:pan.baidu.com/s/1zNWyIDPQ… 提取码:swhh 复制这段内容后打开百度网盘手机App,操作更方便哦