weixin_44923277 于 2019-04-16 20:24:09 发布比如： src 源代码 img 图片资源 js JavaScript脚本 dep 第三方依赖包 不使用复数
比如： 不使用 imgs docs 根目录（root）结构按职能划分
比如： src 源代码（逻辑） doc 文档 dep 第三方依赖包 test 测试 根据业务逻辑进行文件夹的划分
src
common 公共资源
img
logo.png
sprites.png
css
reset.css
js
conf.js 项目的配置文件
public/static 静态资源
js
css
tpl
index.html
shopcar.html
img
component 组件
home
shopcar
login
register
user
list
detail
view/tpl 项目模板 tpl 是 template的缩写 总结：
以上目录开发规范有两种使用途径 纯手动打造 快速构建工具做 —》 改造
2. 前端命名规范
BEM && OOCSS 针对的都是 css 命名规范
jslint eslint js使用规范
BEM规范 概念：
Block Element Modifier，它是一种前端命名方法，旨在帮助开发者实现模块化、可复用、高可维护性和结构化的CSS代码。 BEM是定义了一种css class的命名规范，每个名称及其组成部分都是存在一定的含义。 由拉丁字母, 数字, -组成css的单个名称.
Block Element Modifier
独立且有意义的实体, e.g. header, container, menu, checkbox, etc. Block的一部分且没有独立的意义, e.g. header title, menu item, list item, etc. Blocks或Elements的一种标志，可以用它改变其表现形式、行为、状态. e.g. disabled, checked, fixed, etc.
Naming
由拉丁字母, 数字, -组成css的单个名称.
Block
使用简洁的前缀名字来命名一个独立且有意义的抽象块或组件。
e.g. .block .header .site-search Element 12345
使用__连接符来连接Block 和 Element。
e.g. .block__element .header__title .site-search__field Modifier 12345
使用–连接符来连接Block 或 Element 和 Modifier。
e.g. .block--mo1
