当前位置: 首页 > news >正文

【Vue3项目实战系列一】—— 从零开始一个vue3项目 vue3+javascript+vite 非常详细 手把手教学

😉 你好呀,我是爱编程的Sherry,很高兴在这里遇见你!我是一名拥有十多年开发经验的前端工程师。这一路走来,面对困难时也曾感到迷茫,凭借不懈的努力和坚持,重新找到了前进的方向。我的人生格言是——认准方向,坚持不懈,你终将迎来辉煌!欢迎关注我😁,我将在这里分享工作中积累的经验和心得,希望我的分享能够给你带来帮助。
👉 关于【Vue3项目实战系列】专栏,本专栏旨在帮助新人粉丝全面快速的掌握vue3开发技术,在接下来的日子里我带着大家从零开始一个vue3项目,项目包含了框架搭建,用户登录,用户权限,表格增删改查,表单验证,等一套完整的用户管理系统的实践开发,学完可以帮助前端新人至少拥有一年工作经验,本专栏完全免费,欢迎关注并订阅!🎈
🎯如果你有任何困惑或疑问欢迎评论区给我留言哦,我收到后会第一时间为你答疑解惑😉

要学好一门技术最好的办法就是多实践,用实践去验证理论,看十遍不如去敲一遍代码,边练边理解。

学习vue最好的办法就是自己创建一个项目从头到尾去完成它,在接下来的日子里,我们将一起从零开始去开发一个vue3项目。今天我们先来搭建一下环境。

安装环境介绍

node 18+
vue3
javascript
vite

项目初始化

在这里插入图片描述

安装依赖

在这里插入图片描述
在这里插入图片描述
当出现added 242 packages in 33s 就代表依赖已经安装好了。

安装VSCode编辑器

VSCode,全称 Visual Studio Code,是由微软开发的一款免费且开源的代码编辑器。它支持多种编程语言,并通过插件系统提供了丰富的扩展功能,可以适应各种开发需求。VSCode 拥有轻量级但强大的特性,如智能代码补全(IntelliSense)、内置的Git命令、语法高亮、括号匹配、代码片段、代码重构等。

下载地址:https://code.visualstudio.com/Download
在这里插入图片描述
选择适合自己电脑的安装程序下载,下载后傻瓜式安装即可。

在VSCode中运行项目

双击打开VSCode,File=>Open Folder在这里插入图片描述
选择我们的项目打开
在这里插入图片描述
进入工作面板
在这里插入图片描述

在浏览器里输入http://localhost:5173/ 可访问下面页面
在这里插入图片描述

到这里我们的第一个vue3项目的初始化就完成了。下一篇我们讲【Vue3项目实战】—— 初始目录结构说明

参考文档:https://cn.vuejs.org/guide/quick-start.html

http://www.lryc.cn/news/500580.html

相关文章:

  • Python_Flask04(牛马问答平台01)
  • Java转C之并发和多线程
  • 针对一个系统的权限管理这样的业务场景,使用各设计模式解说
  • Android AppCompatImageView View.Gone状态切换到View.VISIBLE重新layout,Kotlin
  • 在云上轻松部署达梦数据库
  • 什么是厄尔米特(Hermitian)矩阵?
  • React - useActionState、useFormStatus与表单处理
  • v3账号密码登录随机图片验证码
  • 不只是请求和响应:使用Fiddler解读Cookie与状态码全指南(下)
  • java+springboot+mysql游乐园管理系统
  • @RequestBody,getparameter,@RequestParam,@PathVariable之间的区别和联系
  • Linx下自动化之路:Redis安装包一键安装脚本实现无网极速部署并注册成服务
  • VMware虚拟机搭建和镜像配置
  • 红日靶场vulnstark 4靶机的测试报告[细节](一)
  • 深入详解人工智能机器学习常见算法——线性回归算法
  • Python 开发环境搭建
  • OpenCV相机标定与3D重建(9)相机标定函数calibrateCameraRO()的使用
  • flink终止提交给yarn的任务
  • 算法刷题Day14:BM36 判断是不是平衡二叉树
  • 【Golang】Go语言编程思想(六):Channel,第一节,介绍Channel
  • 【Flux.jl】 卷积神经网络
  • 大模型在辅导场景的深度应用,猿辅导素养课推出启发性“AI作文通”
  • 深入了解架构中常见的4种缓存模式及其实现
  • Hermes engine on React Native 0.72.5,function无法toString转成字符串
  • Spring Boot + MySQL 多线程查询与联表查询性能对比分析
  • Java 设计模式~工厂模式
  • OmicsTools生信环境全自动化安装配置教程,代做生信分析和辅导
  • 鸿蒙HarmonyOS应用开发 探索 HarmonyOS Next-从开发到实战掌握 HarmonyOS Next 的分布式能力
  • 二分模板题
  • 一篇文章掌握Git的基本原理与使用