此篇幅主要介绍、我们是如何在vue-cli默认目录结构上去定义此项目的目录结构,如有不足和建议请留言,在此感谢,项目目前阶段还处在少年,不断地在迭代
如图,就是我们项目的目录结构,对于所有的模块都做了细分,目前业务不是很复杂,单页面应用可以支撑,后续可能会考虑使用微前端重新架构
├── public # 静态资源
│ │── favicon.ico # favicon图标
│ │── index.html # html模板
│ │── xxxxxModule.docx # 静态文件
│ └── xxxxxModule.xlsx # 静态文件
├── src # 源代码
│ ├── api # 全局所有请求
│ ├── ├── common
│ ├── ├──├── index.ts
│ ├── assets # 基础数据、全局常量、图片 (由 webpack 处理加载)
│ ├── ├── baseData
│ ├── ├── constant
│ ├── ├── images
│ ├── components # 全局组件、及组件注册(同步异步注册)
│ ├── ├── basicCp # 基础组件
│ ├── ├── businessCp # 业务组件
│ ├── ├── index.ts # 组件注册
│ ├── directive # 全局指令
│ ├── filters # 全局过滤函数
│ ├── icons # svg 图标
│ ├── layout # layout布局
│ ├── mixins # 列表的混入、以及一些公共类的混入
│ ├── router # 路由
│ ├── store # 全局 vuex store
│ ├── styles # 全局 style 统一管理
│ ├── types # 组件 type
│ ├── utils # 工具类、正则、http请求等封装
│ ├── views # 业务页面
│ ├── App.vue # 入口页面
│ ├── main.ts # 入口文件 加载组件 初始化等 entry
│ ├── permission.ts # 权限管理
│ ├── settings.ts # 设置文件
│ └── shims.d.ts # 模块注入
├── .browserslistrc # browserslistrc 配置文件 (用于支持 Autoprefixer)
├── .env.xxx # 环境变量配置
├── babel.config.js # babel-loader 配置
├── package.json # package.json 依赖
├── postcss.config.js # postcss 配置
├── xxx.md # 平台开发规则说明
├── tsconfig.json # typescript 配置
└── vue.config.js # vue-cli 配置
到此,项目目录结构介绍-文章结束,原创不易,感谢浏览!