vue搭建后台平台 系列一(目录结构)

187 阅读1分钟

目录结构

--build      // 构建相关

--config   //配置相关

--src       //源代码

    -- api // 所有的请求

    -- asset // 主题 字体等静态资源 全局的css

         -- icons //icons 图标

        --ele-customize.css //重写element的样式

        --common.css // 公共样式

    --component //模块的组件

        --business-modules //业务组件

        --ui-modules // UI组件

        --public-modlues // 公共组件

    --directive //全局指令

    --filtres // 全局过滤器

    --mock // 项目mock 模拟数据

    -- routers  // 路由

    --store // 全局 store 管理

        --modules //按模块划分vuex的存储

    --utils // 全局公用的方法

    --vendor

    --App.vue // 入口页面

    --main //唯一入口

-- static   // 第三方不打包的东西

     -- version.json 

     --lang

--.babelrc   // babel-loader 的配置

--eslintrc.js  //eslint 配置项

--.gitignore  //git 

-- favicon.ico  //favicon图标

--index.html  // 模版

--package.json

src文件

api存放的是所有的请求,里面根据具体的业务划分,将业务的划分与views模块的一一对应,便于维护

Components

这里面放置的是一些全局公用的一些组件如上传文件等,一些页面的组件还是放在各自的views文件下 便于维护

static

version.json 在构建时写入当前的时间,用于获取发布的版本号 通过这个版本号去通知未退出登陆的用户去刷新页面   

lang是国际化语言,之所以放到static是因为 考虑以后语言包会很大的情况,如果是js会增大压缩后的js的文件大小,这本是不必要的。