【从0到项目实战 vue3+vite】2.创建项目

---

创建一个新的 Vite + Vue3 项目

yarn create vite

在桌面创建vite项目（可以任意目录）
创建vite项目, 分别填入项目名称（Project name），图中例子：vite-vue-proj
选择框架(Vue 方向键上下选择 )
选择变体工具(Javascript 方向键上下选择 )

下载依赖模块

cd vite-vue-proj
yarn

如果出现以下报错，去下面这个链接方便解决
错误解决入口

正常的如下

目录结构

介绍

public

静态资源文件夹，并且不经过 静态模块打包器 (module bundler) 的编译

src

主要代码编写目录，包含vue组件，api接口，网页页面，css样式表，js脚本等等

index.html

网站总的入口文件，vue是单页面应用，挂在id为app的div下然后动态渲染路由模板

pakeage.json

项目配置文件，包含运行脚本，项目描述介绍，项目依赖，依赖版本等等

node_modules

项目下载的依赖库存放目录，是安装node后用来存放用包管理工具下载安装的包的文件夹

yarn.lock

运行下载模块命令后生成的文件，yarn包管理器生成，这文件记录当前项目所依赖的各个包的版本

运行

yarn dev

浏览器打开http://localhost:5173/

运行成功