Vue3项目结构分析

news2024/11/18 14:36:42
  • node_modules:

    • 是项目npm install下载的node依赖库。

  • public:

    • favicon.ico:
      • 网页图标logo图片。
    • index.html:
      • 入口html。是一个基础的html页面,其中进行网页最基础的设置,并且设置了id为app的div盒子。该页面即为Vue单页面应用的基础页面。后续中new出来的vm实例也是会通过id选择器绑定该页面上唯一的dom元素root盒子。
  • src:项目主要资源文件。

    • asserts:
      • 为项目静态文件,存放项目中使用到的图片、logo、背景音频材料等静态资源。

    • components:
      • 存放总组件App下辖的各个分组件。
    • App.vue:
      • 为所有组件的老大,一人之下(vm),万人之上(其余下辖组件)。
    • main.js:
      • 项目js入口文件,引入createApp工厂函数,调用工厂函数并传入App组件,并mount(挂载)到主网页index.html的根div盒子root上,从而实现将App总组件挂载到页面上。后序通过三种插槽,通过路由等操作,从而实现了单页面应用丰富的功能。
  • .gitignore:

    • 在这个文件中写明不需要git管理的文件。

  • .babel.config.js:

    • ES6语法编译配置。

  • jsconfig.json:

    • 定义项目上下文(context)的jsconfig.json文件。

        上下文切换(context switch)定义:根据某种条件,暂停当前进程或线程的执行,保护当前进程或线程的现场,恢复另一个进程或线程的现场,转而执行该进程或线程的过程。

---《计算机科学技术名词 》 (第三版)

  • package-lock.json:

    • 项目依赖版本锁定文件。

  • package.json:

    • 基础配置,告诉我们项目的信息(版本号、项目姓名、依赖)。
  • README.md:

    • 项目介绍说明文件。
  • vue.config.js:

    • 用于自定义 Vue CLI 的默认配置。可以在其中关闭语法检查、修改输出目录、配置代理服务器、添加自定义插件等。

Vue3的项目结构示意图

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1466916.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

QSettings使用示例

解决的问题: 平常要存储一些临时数据,或者ini的系统参数数据,以下是源码解析 如何实现: 实现的UI如下 主要功能: 初始化: m_settings new QSettings("DParamSetting.ini", QSettings::IniFo…

京东数据分析|京东销售数据怎么查|京东销售数据查询软件分享!

京东销售数据分析对商家来说具有多方面的重要作用,主要体现在以下几个方面: 市场趋势分析: 分析京东平台上的商品销量、销售额和价格走势等数据,可以帮助商家了解当前市场的整体需求趋势,以及不同品类的季节性变化、…

PLC为什么要开发网口通讯功能

PLC设置网口通讯功能,是现场总线向工业以太网的迈进,更是为了在网口之上构建更为庞大、开放的大一统的生态系统。 有了以太网,特别是TCP/IP协议后,全员工控人的日常工作更为便利了。 主要体现在以下4点: 1.再也不需要…

01VScode开发stm32环境搭建

title: VScode开发stm32环境搭建 tags: STM32vscode 1.准备工作 1.下载并安装VSCODE 在百度上搜索vscode记住一定要是官方的 不然你自己就是在给自己下毒2345全来了 打红圈一定要有不然就是在垃圾网站上下的 VSCode下载链接 选一个适合你的      安装正常流程走就行不再…

团簇束流沉积技术:氢气传感器守护安全与环境的利器

在当今日益增长的能源需求背景下,氢气作为一种清洁、高效的能源载体,正逐渐受到广泛关注。然而,氢气的易燃易爆特性也带来了不小的安全隐患。因此,精确、快速地监测氢气泄漏成为了确保生产安全和环境监测的重中之重。基于团簇束流…

一些可以参考的文档集合16

之前的文章集合: 一些可以参考文章集合1_xuejianxinokok的博客-CSDN博客 一些可以参考文章集合2_xuejianxinokok的博客-CSDN博客 一些可以参考的文档集合3_xuejianxinokok的博客-CSDN博客 一些可以参考的文档集合4_xuejianxinokok的博客-CSDN博客 一些可以参考的文档集合5…

[C#]winform基于opencvsharp结合pairlie算法实现低光图像增强黑暗图片变亮变清晰

【低光图像增强介绍】 在图像处理领域,低光图像增强是一个具有挑战性的任务。由于光线不足,这些图像往往呈现出低对比度、高噪声和细节丢失等问题,严重影响了图像的视觉效果和后续分析的准确性。因此,开发有效的低光图像增强方法…

无刷电机的2种电流采样方式以及优缺点比较

低端电流采样: 在低端采样方式中,电流检测电阻(分流电阻)通常被放置在逆变器下桥臂MOSFET或IGBT的低端,即靠近电机绕组的地线侧。这种情况下,只有当对应相位的下管导通时,才能通过这个电阻来测量…

命令绕过 [安洵杯 2019]easy_web1

打开题目 打开题目在URL处看到cmd,本能的直接用系统命令ls 发现被过滤了。又注意到imgTXpVek5UTTFNbVUzTURabE5qYz0似乎是一串base64 拿去base64解码 再hex解码一次得到555.png 再将其hex加密 base64加密 反向推出index.php的payload:?imgTmprMlJUWTBOalUzT0RK…

猫毛过敏却想养猫时?如何缓解猫毛过敏?宠物空气净化器推荐

作为一个新养猫的主人,一开始并没有发现对猫咪过敏。直到养了半年才意识到这个问题,而此时我已经和猫咪有了深厚的感情。我不想放弃我的猫咪,但是留着它的话,我经常会因为流眼泪、打喷嚏、眼睛发红等过敏症状而影响日常生活&#…

RabbitMQ-消息队列:发布确认高级

18、发布确认高级 在生产环境中由于一些不明原因,导致 RabbitMQ 重启,在 RabbitMQ 重启期间生产者消息投递失败, 导致消息丢失,需要手动处理和恢复。于是,我们开始思考,如何才能进行 RabbitMQ 的消息可靠投…

LiveQing视频点播流媒体RTMP推流服务功能-支持配置开启 HTTPS 服务什么时候需要开启HTTPS服务

LiveQing视频点播流媒体RTMP推流服务功能支持配置开启 HTTPS 服务什么时候需要开启HTTPS服务 1、配置开启HTTPS1.1、准备https证书1.1.1、选择Nginx类型证书下载 1.2、配置 开启 HTTPS1.2.1 web页面配置1.2.2 配置文件配置 2、验证HTTPS服务3、为什么要开启HTTPS3.1、安全性要求…

HTML+CSS:动态搜索框

效果演示 这段代码实现了一个简单的搜索栏效果。页面背景为从天蓝色到深蓝色的渐变色,搜索栏包括一个圆形背景的搜索图标和一个输入框。当用户点击搜索图标时,输入框会从搜索图标的位置滑出,显示一个输入框和一个清除按钮。用户可以在输入框中…

【JAVA】Tomcat的安装

目录 官网链接 下载安装程序 解压 启动Tomcat 问题 其他文件介绍 官网链接 Apache Tomcat - Welcome!https://tomcat.apache.org/ 下载安装程序 进入官网后,点击如下tomcat 8: 进入tomcat 8后选择zip文件下载 解压 Tomcat是一个基于java实现的“绿色软件…

八、线性代数二 ,矩阵的秩

目录 1、矩阵子式的定义与子式个数的计算: 2、矩阵秩的定义: 3、矩阵秩的计算方法: 4、矩阵秩的 性质: 线性代数四——几个重要的矩阵点积_线性代数 矩阵点积-CSDN博客 1、矩阵子式的定义与子式个数的计算: 概念&…

【数学建模规则】2024年第九届数维杯大学生数学建模挑战赛参赛指南

一、竞赛介绍 数维杯大学生数学建模挑战赛每年分为两场,每年上半年为数维杯国赛(5月,俗称小国赛),下半年为数维杯国际赛(11月),2023年第八届数维杯大学生数学建模挑战赛共有近1.4万名学生参赛,…

vue : 无法加载文件 C:\Program Files\nodejs\node_global\vue.ps1,因为在此系统上禁止运行脚本。

解决方法: 打开PowerShell,在命令框输入set-ExecutionPolicy RemoteSigned 在PowerShell中输入会出现如下图,输入y即可。

【Flink精讲】Flink组件通信

主要指三个进程中的通讯 CliFrontendYarnJobClusterEntrypointTaskExecutorRunner Flink内部节点之间的通讯使用Akka,比如JobManager和TaskManager之间。而operator之间的数据传输是利用Netty。 RPC是统称,Akka,Netty是实现 Akka与Ac…

网络编程 TCP/UDP通信

网络编程 TCP/UDP通信 1. 0.0.0.0地址与客户端bind函数2. UDP 服务器与客户端通信3. TCP 服务器与客户端通信 1. 0.0.0.0地址与客户端bind函数 0.0.0.0的地址作用 在网络编程中,0.0.0.0是一个特殊的IP地址,通常用于表示"任意地址"或"所有…

Linux:ACL权限,特殊位和隐藏属性

目录 一.什么是ACL 二.操作步骤 ① 添加测试目录、用户、组,并将用户添加到组 ② 修改目录的所有者和所属组 ③ 设定权限 ④ 为临时用户分配权限 ⑤ 验证acl权限 ⑥ 控制组的acl权限 三. 删除ACL权限 一.什么是ACL 访问控制列表 (Access Control List):ACL 通…