Vue(renren-fast_vue_master)项目目录结构[通俗易懂]

Vue(renren-fast_vue_master)项目目录结构[通俗易懂]打算做一个请假管理OA项目Demo,后端采用renren-fast框架,后台管理系统采用renren-fast_vue_master项目,打算利用renren-fast-vue-master改造成一个简单的请假管理系统,包含注册、登陆、请假流程查看等等简单的展示即可,由于之前没做过Vue,现简单地介绍下项目目录结构:├──build/#Webpack配…

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全家桶1年46,售后保障稳定

打算做一个请假管理OA项目Demo,后端采用renren-fast框架,后台管理系统采用renren-fast_vue_master项目,打算利用renren-fast-vue-master改造成一个简单的请假管理系统,包含注册、登陆、请假流程查看等等简单的展示即可,由于之前没做过Vue,现简单地介绍下项目目录结构:

├── build/                 # Webpack 配置目录(webpack的文件)
├── config/                # vue项目的基本配置文件 
├── node_modules/          # 是项目中安装的依赖模块 
├── src/                   # 源码目录(开发都在这里进行)
│   ├── assets/            # 放置需要经由 Webpack 处理的静态文件
│   ├── components/        # 组件
│   ├── filters/           # 过滤器
│   ├── store/         # 状态管理
│   ├── routes/            # 路由
│   ├── services/          # 服务(统一管理 XHR 请求)
│   ├── utils/             # 工具类
│   ├── views/             # 路由页面组件
│   ├── app.js             # 启动文件
│   ├── main.js            # 入口文件
│   ├── index.html         # 静态基页
├── static/              # 放置无需经由 Webpack 处理的静态文件
├── .babelrc             # Babel 转码配置
├── .eslintignore        # (配置)ESLint 检查中需忽略的文件(夹)
├── .eslintrc            # ESLint 配置
├── .gitignore           # (配置)需被 Git 忽略的文件(夹)
├── package.json         # 项目文件,记载着一些命令和依赖还有简要的项目描述信息
├── package-lock.json    # 记录当前状态下实际安装的各个npm package的具体来源和版本号

Jetbrains全家桶1年46,售后保障稳定

Vue(renren-fast_vue_master)项目目录结构[通俗易懂]

上述目录结构中,需要注意的是src/components/与src/views/的区别:

src/components/                    # 组件
    ├── App.vue                      # 根组件
    ├── Breadcrumb.vue               # 面包屑
    ├── Navbar.vue                   # 顶部导航栏
    ├── Pagination.vue               # 分页
    ├── Select/                      # 下拉框选择框组件
    │   ├── LimitSelect.vue            # “每页显示多少条记录” 下拉选择框
    │   └── Select2.vue                # 对 Select2 的封装
    └── Sidebar/                     # 侧边栏组件
        ├── index.vue                  # 侧边栏
        └── Link.vue                   # 导航链接封装

src/views/                         # 路由页面组件
    ├── index.vue                    # 首页
    ├── auth/                        # 用户认证模块
    │   ├── login.vue                  # 登录页
    │   └── logout.vue                 # 注销登录页
    └── msg/                         # 留言板模块
        ├── index.vue                  # 对应 /msg(留言板首页,alias => /msg/list)
        ├── list.vue                   # 对应 /msg/list(留言板列表)
        ├── add.vue                    # 对应 /msg/add(新增留言)
        ├── detail.vue                 # 对应 /msg/detail/:msgId(查看留言)
        ├── update.vue                 # 对应 /msg/update/:msgId(修改留言)
        ├── _components/               # 留言板模块共用组件
        │   ├── AuthorSelect.vue         # 留言发布者选择下拉框
        │   ├── MsgForm.vue              # 留言表单
        │   └── OptBtnGroup.vue          # 留言操作按钮组
        └── _mixins/                   # 留言板模块共用 mixins
            └── autoLoadByParams.js      # 根据 $route.params.msgId 自动加载

根据注释,二者的差别如下:
src/components/
主要是全局性的,或通用性很强的组件,具备良好的封装性,一般不涉及到具体的业务逻辑

Vue(renren-fast_vue_master)项目目录结构[通俗易懂]

src/views/

主要是业务性的页面组件,基本不具备通用性,而且基本与路由一一对应
/src/views/common/login.vue(404.vue、home.vue) 对应着路由 /common/login(404、home)
各功能模块(common、demo、modules)内部可分离出通用部分
总之,绝大多数的页面按钮、表单等模块都放在该目录下

Vue(renren-fast_vue_master)项目目录结构[通俗易懂]

 

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/219281.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)
blank

相关推荐

  • java通过SMS短信平台实现发短信的功能

    java通过SMS短信平台实现发短信的功能

  • SpringBoot图片验证码

    SpringBoot图片验证码“原生js+SpringBoot+hutool工具”实现浏览器验证码功能,点击可刷新。

    2022年10月16日
  • 遗传算法经典实例matlab代码_退火算法与遗传算法

    遗传算法经典实例matlab代码_退火算法与遗传算法经典遗传算法及简单实例(MATLAB)1.遗传算法简单介绍1.1理论基础1.2算法要点1.1编码1.2适应度函数1.3基本流程2.雪兔实例1.遗传算法简单介绍1.1理论基础整个算法的基础就是达尔文的生物进化论,“物竞天择,适者生存”这句话已经是常识了。雪兔的故事:东北那旮瘩,有群原始雪兔,刚从未知物种进化而来,五颜六色(表现型)漂亮极了,称之为I(0)。(注意:种群初始化)入夏了,雪兔们出来觅食,浅色兔在草地中无所遁形,被雪狐收割了一波(大批浅色+小批深色)。入冬了,雪

  • ubuntu ipsec配置_ubuntu安装iperf3

    ubuntu ipsec配置_ubuntu安装iperf3ipsetpackageinUbuntuipset:administrationtoolforkernelIPsetsipset-dbgsym:debugsymbolsforipsetlibipset-dev:developmentfilesforIPsetslibipset13:libraryforIPsetslibipset13-dbgs…

  • 细数泄漏过的数据库,目前已知公开的!「建议收藏」

    细数泄漏过的数据库,目前已知公开的!「建议收藏」先看看这张超长图吧,这里为大家提醒,一定要谨慎在网络中留下隐私信息!同时经常改密码。补天漏洞响应平台的攻城狮和程序猿们花了很长时间,整理了这么一张灰常漂亮的图。这里整理的仅仅是已经被公开的部分,实际上地下有很多企业的大量数据库在流传,社工库已经强大到威胁到所有人的隐私信息,信息安全问题急需解决。我们知道还遗漏了很多数据,欢迎大家给我…

  • 校验和计算原理_CRC校验原理及代码

    校验和计算原理_CRC校验原理及代码校验和思路首先,IP、ICMP、UDP和TCP报文头都有检验和字段,大小都是16bit,算法基本上也是一样的。在发送数据时,为了计算数据包的检验和。应该按如下步骤:1、把校验和字段设置为0;2、把需要校验的数据看成以16位为单位的数字组成,依次进行二进制反码求和;3、把得到的结果存入校验和字段中在接收数据时,计算数据包的检验和相对简单,按如下步骤:1、把首部看成以16位为单位的数字组成,依次进行二

    2022年10月26日

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号