项目规范[Vue项目组织结构和命名规范]

项目结构

• build/ 项目构建(webpack)相关代码，在开发阶段，我们基本不用管。
• config/ 配置目录，包括端口号等。我们初学可以使用默认的。
  • index.js 主配置文件
  • dev.env.js 开发环境变量
  • prod.env.js 生产环境变量
• dist/ 项目打包后的文件(默认)
• node_modules/ npm 加载的项目依赖模块(自动)
• src/ 这里是我们要开发的目录，基本上要做的事情都在这个目录里。里面包含了几个目录及文件：
  • assets/ 放置一些图片，如logo等。
    • styles/
    • images/
    • fonts/
  • components/ 目录里面放了一个组件文件，可以不用。
  • extends/ 自己封装的一些工具
    • common/ 常用
    • wechat/ 微信
    • constant.js 常量
    • ...
  • router/ 静态资源目录，如图片、字体等。
  • store/ vuex
  • views/ 静态资源目录，如图片、字体等。
  • App.vue 项目入口文件，我们也可以直接将组件写这里，而不使用 components 目录。
  • main.js 项目的核心文件。
• static/ 如图片、字体等。纯静态资源，该目录下的文件不会被webpack处理，该目录会被拷贝到输出目录下；
• .babelrc babel 的配置文件
• .editorconfig 编辑器的配置文件；可配置如缩进、空格、制表类似的参数；
• .eslintignore eslint 的忽略规则
• .eslintrc.js eslint 的配置文件
• .gitignore git的忽略配置文件
• .postcssrc.js postcss 的配置文件
• index.html 首页入口文件，你可以添加一些 meta 信息或统计代码啥的。
• package.json npm包配置文件，里面定义了项目的npm脚本，依赖包等信息
• README.md 项目的说明文档，markdown 格式

开发命名规范

views下的文件夹名

1. views下的文件代表模块名字
2. 由单个小写的英文名词组成
3. 建议:[user,order,city,product]
4. 不建议[userinfo,User,big]

views下文件命名

1. 代表页面的名字
2. 放在模块文件夹之下，单个页面的情况直接放在views下
3. 两个以及两个以上驼峰英文名词组成单词首字母大写
4. 常用后缀（Detail、Edit、List、Info、Report）

函数变量命名规范

变量命名 函数命名

数据/钩子/资源 常用排序

1. components
2. props
3. data
4. created
5. mounted
6. activited
7. update
8. beforeRouteUpdate
9. metods
10. filter
11. computed
12. watch

常用缩写参考

常见编程缩写