``` node_modules // 项目依赖 public // 入口页面目录 | |-- index.html // 入口页面 src // 项目源文件 | |-- assets // 资源目录，这里的资源会被wabpack构建 | |-- base // 全局公共样式目录 |-- iconfont // 存放额外字体图标 |-- image // 图片目录 |-- js // 公共JS方法 |-- components // 公共项目组件目录 用于存放独立功能或需多复用组件文件 |-- router // 项目路由目录 | |-- index.js // 路由文件 |-- store // 项目状态目录 应用级数据（state） | |-- modules |-- index.js |-- store.js |-- backups // 页面备份文件目录 |-- views // 视图文件目录 根据项目状态 可自定义 |-- App.vue // 根组件 |-- main.js // 入口JS文件 api // 集成axios请求 封装公共接口组建 | |-- utils | |-- api.js // 接口集成 |-- request.js // HTTP 请求封装拦截 |-- index.js // 暴露接口文件 .env.development // 测试环境配置文件 .env.production // 生产环境配置文件 .eslintrc // ESLint 校验文件 babel.config.js // Babel插件 package.json // 项目信息及项目包版本 当项目安装新依赖时需提交仓库 package.lock.json // 锁定当前项目包信息及项目包版本 postcss.config.js // 适配移动端配置文件 README.md // 描述说明文档 vue.config.js // 项目自定义配置 配置项目名及项目代理 ``` <br /> >01\. 该结构为项目初始结构，目录初始化结构 / 父子层级关系 / 以及命名规则不可随意更改。 02\. 可以根据项目不同需求不同功能在原结构向下扩展，但需严格遵循以下条件进行。 03\. 不同模块分离清晰，父子组件层级明确，文件不混淆不叠加。 04\. 文件夹的命名方式主要以功能模块代表并且以小驼峰式命名，禁止使用数字中划线 - 下划线 \_ 其他特殊字符以及汉语拼音，名称简洁语义化。 05\. 开发过程中可以复用的组件需要在 components 目录下进行二次封装，功能函数集成在 assets 目录下统一调用。