关于前端构建项目的规范

关于前端构建项目的规范
一、前端目录构建规范的作用

目的是与项目开发的目录结构保持一致,便于项目的构建与管理。

二、资源分类

1、源代码资源

指开发者编写的源代码,包括html、css、template等

2、内容资源

指希望作为内容提供给访问者的资源,包括图片、字体、flash、pdf等,最常用的应该就是readme.md文件

三、目录命名规则

1、简洁  有习惯性的缩写单词,采用容易理解的缩写。如源代码目录src,不要写成source

2、常用的一些文件名称

img:图片  不要使用image、images、imgs等

js:JavaScript脚本  不要使用script、scripts等

css:样式表  不要使用style、styles等

swf:flash  不要使用flash等

src:源文件目录  不要使用source等

dep:第三方依赖包  不要使用lib、library、dependency等

注意:不允许出现复数形式,如imgs、deps是不允许的。

四、根目录的划分

根目录下按照职能进行划分,不允许将资源类型或者业务逻辑的目录划分到根目录下。

根目录下常用的文件如下:

src

test

doc

dep

五、业务逻辑划分src目录结构

业务项目的src目录内,绝大多数情况应该根据业务逻辑划分目录结构。

业务逻辑下常用的文件如下:

utils

common

components

routers

assets

api

store

view

static

vue的命名规范

组件的data必须是一个函数

v-for 设置键值

避免 v-ifv-for 用在一起

prop定义尽量详细

尽量使用组件化开发思想: 提高开发效率 方便重复使用 提升整个项目的可维护性 便于协同开发 低耦合。

vue文件方法声明顺序

关于前端构建项目的规范

注释

关于前端构建项目的规范

编码规范

关于前端构建项目的规范

命名规范

关于前端构建项目的规范

oocss (书写规范)

OOCSS不是一个框架,也不是一种技术,更不是一种新的语言,他只不过是一种方法,一种书写方式,换句话说OOCSS其核心就是用最简单的方式编写最整洁,最于净的CSS代码,从而使代码更具重用性,可维护性和可扩展性 ( 把原本写在一起的样式, 拆开多个class 写,提高可复用性)。