项目规范

目录结构

├─build                    // 打包文件目录
├─config                   // 打包文件一些可配置的目录
├─src  
|   ├─api                  // 存放api请求,文件名与模型名一致,方法名/变量名与后端接口一致
|   ├─assets               // 静态资源  
|       ├─ images          // 静态图片资源
|       ├─ icons           // 阿里矢量图标等
|       ├─ fonts           // Font Awesome 字体图标等
|   ├─ components          // 公用组件(多个页面级别的)
|   ├─ const               // 全局变量存储(如默认页面标题)
│   ├─ directives          // 自定义指令
│   ├─ filters             // 自定义过滤器
|   ├─ i18n                // 多语言
|   ├─ mixins              // 全局mixin
|   ├─ plugins             // 自定义插件存放目录(如用axios封装的ajax请求)
|   ├─ router              // 路由文件
|   ├─ store               //  vuex
|   ├─ styles              // 样式文件
|   ├─ utils               // 辅助函数存放目录
|   ├─ views               // 视图层(里面可在分文件,个人页面下的components,mixins等)
|       ├─ a               // a页面
|          ├─  components       // a页面的component
|          ├─  mixins           // a页面的mixins
|          ├─  APage.vue        // a页面router
|   ├─ App.vue  
|   ├─ mian.js 
├─static                   // 一些静态资源目录
├─test                     // 单元测试 (很少有,目前只有ui组件库真正实行起来)
├─index.html               // 根 html
├─package.json             // npm相关的依赖文件及执行命令

基础规范

  • 文件夹名/js文件名/json文件名/css文件名:采用小驼峰命名
  • .vue文件:大驼峰命名
  • css样式名:采用主模块命名,(如改文件的最外层class名为.a,其子元素可命名为.aheader)
  • 代码规范:自定义eslint加成
千千学习、练习用
JSRUN前端笔记, 是针对前端工程师开放的一个笔记分享平台,是前端工程师记录重点、分享经验的一个笔记本。JSRUN前端采用的 MarkDown 语法 (极客专用语法), 这里属于IT工程师。