零基础手把手玩vue3.0+element+net5(三)
cac55 2024-10-11 11:03 12 浏览 0 评论
上次已经创建成功的项目，现在我们通过vs code来打开项目(vs code的安装这里就不介绍了，有需要的请留言或私信)，vs code打开文件夹即可
点击终端，新终端，运行项目：npm run dev
报错了，查看本机环境变量中是否包含：
C:\Program Files\nodejs\node_modules\npm\bin
删除，重启电脑，再运行，项目启动成功：
项目运行起来之后怎么停止，快捷键：Ctrl+C，终端页面会提示是否终止，输入：Y，即可。
接下来分析下整个项目的结构，从下到上解析下每个文件的作用：
1、vite.config.js
使用vite创建的项目，会生成vite.config.js文件，vite配置可参照官网进行修正(具体使用后面会根据项目来讲解)
https://vitejs.dev/config/
2、package.json
package.json文件，定义了这个项目所依赖的包，记录项目所需要的各种模块，以及项目的配置信息。
3、package-lock.json
package-lock.json 是在 npm install时候生成一份文件，用以记录当前状态下实际安装的各个npm package的具体来源和版本号；
在执行npm install时，先读取package.json中的依赖，再读取package-lock.json中的版本号，从而来决定安装和更新。
与package.json的区别就是，package.json文件只能锁定大版本，也就是版本号的第一位，并不能锁定后面的小版本，package-lock.json会锁定到具体的小版本，也就是说，package-lock.json版本更精细和具体点。
4、index.html
主页，项目入口，项目运行起来，访问地址打开的就是index.html
5、.gitignore
顾名思义，.gitignore就是git提交时忽略的文件或文件夹
6、main.js
main.js是项目的入口文件；这里需要稍微说明下main.js和index.html的关系：
在项目运行中，main.js作为项目的入口文件，运行中，找到其实例需要挂载的位置(id="app"，挂载在了index.html的app标签上)，即index.html中。
把两个文件结合起来看就很好理解了，main中创建应用实例(每个 Vue 应用都是通过用 createApp 函数创建一个新的应用实例开始的)，然后将应用实例挂载(mount)到index.html的#app标签上
7、src文件夹
src文件夹中就是项目所有的页面及资源了，一般assets下放置资源文件，图片、js、css文件等等，components中放置自定义组件，其他页面结构可根据实际的业务创建目录(文件夹)来区分。
8、public
public文件夹下也是放置一些资源文件，与assets下的区别就是：
①assets目录中的文件会被webpack处理解析为模块依赖；
②public目录下的文件并不会被Webpack处理，它们会直接被复制到最终的打包目录（默认是dist/static）下，必须使用绝对路径引用这些文件
9、node_modules
node_modules下放的是npm依赖的包(项目依赖的模块)，每个项目都是独立的。
相关推荐
- 远程桌面管理服务器的软件工具:Splashtop
-
通过远程控制和维护服务器，IT运维无需亲自在设备附近就可以轻松完成工作，极大地提高了效率。在本文中，我们将深入了解远程桌面管理服务器的主要优点，以及实现此任务所需的软件工具和操作方法。首先，远程桌面管...
- 最担心的事还是发生了 19岁黑客远程破解逾25台特斯拉
-
近日，德国19岁的安全研究人员大卫·科伦坡（DavidColombo）表示，他在特斯拉的系统中发现一处系统漏洞，并通过该漏洞远程入侵了13个国家的25辆特斯拉电动汽车，使其关闭安全系统。他几乎掌控了...
- 朝鲜黑客使用已知恶意软件家族FASTCash的 Linux 变种来窃取资金
-
据观察，朝鲜威胁组织使用已知恶意软件家族FASTCash的Linux变种来窃取资金，作为以财务为动机的活动的一部分。一位自称HaxRob的安全研究员表示，这种恶意软件“安装在受感染网络内处理卡...
- Phorpiex恶意脚本卷土重来，成为LockBit 3.0勒索木马传播载体
-
IT之家5月5日消息，安全公司Cybereason发文透露“老牌”恶意脚本Phorpiex近日又卷土重来，成为传播LockBit3.0勒索木马的载体，感染了相应脚本的设备会自动下...
- 黑客远程入侵控制Jeep 自由光 互联网汽车存隐患
-
当我们在为汽车互联网技术带来的便捷欢呼雀跃时，也许危险也在悄悄走近。近日据Wired报道，名叫安迪的男子正开着Jeep自由光以70码的时速行驶在圣路易斯下城区时，车辆突然失去了控制。“首先是冷风突然调...
- 警惕!KeePass密码管理器竟成黑客“帮凶”
-
近日，网络安全领域爆出一则令人震惊的消息：网络安全公司WithSecure披露，在过去至少八个月的时间里，黑客通过篡改知名的KeePass密码管理器，上演了一场大规模的恶意攻击大戏！KeePass作...
- 开源网页应用框架ThinkPHP遭黑客滥用，变身远程代码执行工具
-
IT之家6月9日消息，安全公司Akamai近日发布报告，声称目前有黑客滥用一款热门开源网页应用框架ThinkPHP中的远程执行代码漏洞，打造了一款名为“Dama”的恶意工具进行攻击。I...
- 远程控制、窃密、挖矿!我国境内捕获“银狐”木马病毒变种
-
最近大家可得小心电脑病毒了！国家相关部门刚通报了一个叫"银狐"的木马病毒新变种，专门盯着普通老百姓和企事业单位下手。我给大家掰开揉碎了讲讲，遇到这种情况该怎么躲坑？·一、这病毒怎么盯上...
- 6款Linux常用远程连接工具，你最中意哪一款?
-
点击上方头像关注我，每周上午09:00准时推送，每月不定期赠送技术书籍。本文2106字，阅读约需6分钟Hi，大家好。远程连接的实现方法有很多，概括地说有两种，一种是用系统自带的远程连接，另外一种是用...
- 安全公司曝光黑客山寨杀毒软件Bitdefender官网，实为提供木马
-
IT之家5月31日消息，安全公司DomainTools发文，透露有黑客伪造网站声称提供杀毒软件，实则借机传播恶意木马。IT之家参考相应通报获悉，相应黑客首先建立山寨Bitdefender...
- 魔兽世界怀旧服:mc与bwl高手进阶输出手法与职业心得理解
-
作者：NGA-499917309a前言：之前写了两篇教新手术士怎么打mc和bwl的帖子，属于基础入门，只是让大家会打，随着时间推移，副本早已进入farm阶段，新手也不满足于会打，而是追求更高的输出，甚...
- 《奇幻梦境》进不去游戏解决方法攻略
-
奇幻梦境第一章近日发售了，本作也是一款第一人称解密游戏。本作的游戏画面色彩简单明了，包括了游戏的剧情也是。有不少的小伙伴反映奇幻梦境打不开不进不去，接下来小编就给大家解决这款游戏打不开进不去的一些可能...
- 国外网友热议:LOL客户端仍然如此差劲!新版又在测试了?
-
印象中英雄联盟的客户端换过几次版本，但是动作最大的应该就是在2017年的那次，直接更换了整个客户端的UI界面以及内部的很多组件。但是新版客户端上线至今两年多的时间里，玩家对于这个客户端的吐槽依旧很多，...
- 谷歌地球免费专业版7.1.5.1557下载
-
IT之家讯5月22日消息，谷歌地球专业版GoogleEarthPro已经更新到7.1.5.1557版，目前，谷歌官方还没有给出更新日志。这种情况通常来讲都是常规问题修复，建议新老用户及时下载安装...
- 僵尸部队三部曲 免安装中文硬盘版下载发布
-
【游戏封面】中文名称：僵尸部队三部曲游戏名称：ZombieArmytrilogy游戏类型：第三人称射击游戏制作：Rebellion游戏发行：Rebellion游戏发行：PC游民星空狙击精英3专区版...
欢迎 你 发表评论:
- 一周热门
- 最近发表
-
- 远程桌面管理服务器的软件工具:Splashtop
- 最担心的事还是发生了 19岁黑客远程破解逾25台特斯拉
- 朝鲜黑客使用已知恶意软件家族FASTCash的 Linux 变种来窃取资金
- Phorpiex恶意脚本卷土重来，成为LockBit 3.0勒索木马传播载体
- 黑客远程入侵控制Jeep 自由光 互联网汽车存隐患
- 警惕!KeePass密码管理器竟成黑客“帮凶”
- 开源网页应用框架ThinkPHP遭黑客滥用，变身远程代码执行工具
- 远程控制、窃密、挖矿!我国境内捕获“银狐”木马病毒变种
- 6款Linux常用远程连接工具，你最中意哪一款?
- 安全公司曝光黑客山寨杀毒软件Bitdefender官网，实为提供木马
- 标签列表
-
- 如何绘制折线图 (52)
- javaabstract (48)
- 新浪微博头像 (53)
- grub4dos (66)
- s扫描器 (51)
- httpfile dll (48)
- ps实例教程 (55)
- taskmgr (51)
- s spline (61)
- vnc远程控制 (47)
- 数据丢失 (47)
- wbem (57)
- flac文件 (72)
- 网页制作基础教程 (53)
- 镜像文件刻录 (61)
- ug5 0软件免费下载 (78)
- debian下载 (53)
- ubuntu10 04 (60)
- web qq登录 (59)
- 笔记本变成无线路由 (52)
- flash player 11 4 (50)
- 右键菜单清理 (78)
- cuteftp 注册码 (57)
- ospf协议 (53)
- ms17 010 下载 (60)