Vue与spring boot项目结构
Vue项目结构目录helloVue3/├── node_modules/ #执行npm install命令后从网上下载到的相关依赖文件├── public/ #静态资源文件夹│ ├── vite.svg #网站图标├── src/│ ├── assets/ #放置静态资源包括公共的 css 文件、 js 文件、iconfont 字体文件、img 图片文件 以及其他资源类文件。之所以强调是公共的 css 文件是因为要在组件的 css 标签里加入 ‘scoped‘ 标记将其作用范围限制在此组件以及调用它的父级组件中避免污染全局样式。│ │ └── logo.png #图标│ ├── components/ #存放 vue 组件(通用模块组件)避免重复工作,每个组件都是独立的.vue 文件│ │ └── HelloWorld.vue│ ├── views/ #存放视图组件│ │ └── Home.vue│ ├── App.vue #应用程序根组件整个应用的入口点通常包含路由视图和其他全局共享组件│ ├── main.js #应用的入口文件负责创建 Vue 实例并挂载到 DOM 上执行npm run dev时最先加载此文件串联所有模块│ ├── router/ #存放路由配置文件。│ │ └── index.js #路由的配置文件定义了应用的路由规则。前端项目所有后端接口的 “接口注册表”统一管理所有请求地址├── .gitignore├── package.json #基础配置告诉我们项目的信息版本号、项目姓名、依赖├── index.html #单页面的入口通过 webpack 的打包构建之后会对 src 源码进行编译最终把它们插入到 html 里面来。├── vue.config.js #Vue CLI 的配置文件用于修改默认配置。└── yarn.lock or package-lock.json #锁定安装的依赖版本确保项目依赖的一致性。vue3项目启动时首先会先加载public/index.html文件然后会加载main.ts文件。其中从vue文件中导入了一个createApp方法把App.vue文件导入了起名叫App然后执行createApp方法把App.vue页面当做参数传入并执行mount(‘#app’)方法意思就是让index.html的中显示App.vue页面。springboot项目结构目录my-spring-boot-project/├── src/│ ├── main/│ │ ├── java/com/example/myapp/│ │ │ ├── Application.java # 主入口类│ │ │ ├── controller/ # 控制器层处理 HTTP请求返回响应。│ │ │ │ └── MyController.java│ │ │ ├── service/ # 服务层处理业务逻辑通常包含接口和实现类。│ │ │ │ ├── MyService.java # 接口│ │ │ │ └── impl/MyServiceImpl.java # 实现类│ │ │ ├── mapper/ # 数据访问层、持久层DAO与数据库交互在 Spring Data JPA 中常用repository/ 替代│ │ │ │ └── MyMapper.java│ │ │ ├── entity/ # 实体类数据库映射│ │ │ │ └── MyEntity.java│ │ │ ├── dto/ # 数据传输对象用于层间数据传递隔离 Entity定制字段。│ │ │ │ ├── MyRequestDto.java # 请求 DTO│ │ │ │ └── MyResponseDto.java # 响应 DTO│ │ │ ├── config/ # 配置类│ │ │ └── util/ # 工具类│ │ └── resources/│ │ ├── application.properties # 配置文件│ │ ├── static/ # 静态资源│ │ └── templates/ # 模板文件│ └── test/ # 测试代码和资源├── target/ # 对标node_modules编译打包后生成的class、jar包mvn package产出├── pom.xml # Maven 构建文件└── README.md # 项目说明. 数据流转请求: 用户 → Controller接收 MyRequestDto→ Service转为 MyEntity→ DAO保存到数据库。响应: DAO返回 MyEntity→ Service转为 MyResponseDto→ Controller返回给用户。spring boot一般的项目结构 - joken1310 - 博客园