文档结构

项目文档结构

- build                    //自动化部署相关配置
- dist                    //文件生成目录(运行build之后生成,release到此文件夹)
    -- ...                 
- node_module             //自动安装(第三方模块,包括各种辅助构建工具,以及框架)
    -- ...
- npmPlugins             //npm插件
- src                     //源码文件(开发环境)
    -- assets            //静态资源(包含UI样式)    具体查看 ui文档结构
    -- components          //组件                   具体查看 通用组件文档结构
    -- pages             //业务模块                  具体查看 业务组件文档结构
    -- store             //数据仓库以及后端接口     具体查看 状态管理组件文档结构
    -- util              //工具包                例如swiper 
    -- app.vue              //根组件
    -- main.js           //入口文件
    -- kdweibo.js        //云之家api
    -- route-config.js  //路由配置
- static                 //静态文件
- .babelrc                 //转化es2015(新版的babel是需要在文件上配置的,如果没有此文件会导致webpack-config里面对应的配置不生效) 
- .editorconfig             //编辑器配置文件(例如 缩进2格)
- config.js                 //开发环境配置文件
- index.ejs                 //js模板(暂时没用)
- index.html             
- package.json             //npm 配置
- pro_service.js         //临时服务器(暂时没用)
- sftp-config.json         //ftp 配置
- webpack.cofig.js         //webpack配置

UI文档结构

- base                      
    -- base                  //ui样式基本库
        -- mixin            //常用功能封装
            -- basic.styl    
            -- mobile.styl
            -- basic.styl
            -- setArrow.styl
            -- setChecked.styl
            -- setOnepx.styl
            -- text.styl
        -- variable            //从widget中抽出来的变量,方便以后改动
            -- themes         //样式主题,可以自行增加
            -- ...
        -- fn.styl        //variable入口文件
        -- reset.styl    //初始化样式
    -- widget              //ui组件样式库
        -- button
        -- calculate
        -- calendar
        -- cell
        -- dialog
        -- panel
        -- tab
    -- ui.styl        //widget入口文件,包含所有widget样式
- index.styl        //base入口文件,这里引用到了ui样式库和ui组件库

通用组件文档结构

- base.js        //基类 包含表单验证
- index.js         //引入vue模块,并且注册,将注册后的对象返回
                 这个主要是为了将来迁移做的优化,值需要引入这个文件,不需要再页面再注册
                 例如: 使用button模块,直接可以这样写 
- cell.vue         //一个单元     
- cells.vue         //一组单元    
- cellInput.vue  //含有输入框的单元
- flex-para.vue     //随着文字增多,字体大小变小
- menu.vue         //菜单         
- menu-item.vue  //菜单item
- number.vue         //含有-+数字
- selectperson.vue   //云之家-人员选择
- swiper.vue         //图片左右滑动
- tab.vue         //导航栏
- tab-item.vue     //导航栏item
- uploader.vue     //云盘-上传图片

业务组件文档结构

- apply //报销单模块
    -- applylist.vue    //我的报销
    -- edit.vue            //新增
    -- history.vue        //历史
    -- item.vue         //明细
    -- nodeline.vue        //节点    
    -- todolist.vue        //我的代办
    -- view.vue            //审批
    -- workflow.js        //工作流模式

- consumption //录入消费明细模块
    -- bot.vue            //底部消费信息
    -- edit.vue            //新增明细
    -- item.vue            //明细
    -- list2edit.vue    //编辑
    -- list2view.vue        //审批
    -- sum.vue            //汇总
    -- viewConsump.vue  //审批
    
- demo    
- 404.vue    
- base.js                //自动导入组件并注册  
- common.vue             //过渡动画模块 
- enums.js                 //枚举表
- home.vue               //主页面
- rightManage.vue         //人员权限模块
- start.vue              //为了后续渲染,阻塞页面
- sysConf.vue             //权限管理模块

store文档结构

- api        //后端接口-api
- modules    //Vuex模块
    -- apply.js      //报销模块
    -- setting.js     //权限管理、人员管理、admin
    -- user.js         //登录用户信息,userId openId等
    -- valid.js         //表单验证
- aciton.js             //Vuex-aciton         
- getter.js             //Vuex-getter
- index.js             //store入口
- mutation-types.js  //Vuex-mutationType

你可能感兴趣的:(文档结构)