一、使用Vite创建项目

1、全局安装Vite

pnpm create Vite

2、输入项目命名

3、输入包的名称

4、选择要创建的框架类型

5、选择使用js或者ts

6、是否使用rolldown打包

当前rolldown处于实验阶段,用于替代原本的rollup打包工具,目的是提升打包效率,但现阶段尚不稳定。

7、是否使用pnpm install安装nodeModules目录下的必须包,并运行项目


 

8、创建完成

二、 使用命令行创建vite

1、执行命令行

pnpm create vite vue3 --template vue

2、执行后续操作

跳过上面的第1、2步,在命令行中输入项目名称vue3,后续操作与一相同

三、代码结构

1、.vscode

必要的插件安装配置

2、node_modules

项目所需的依赖包

3、public

静态文件存放,通常放公共配置文件、图片等

4、src

src为主要开发代码文件目录

通常包含assets(静态文件存放)、apis(接口)、components(公共组件)、router(路由)、utils(公共函数)、store (状态管理)、hook(钩子函数)、views(主要页面组件)app.vue(根组件)、main.ts(入口文件)、styel.css(主样式表)等

5、.gitignore

git代码修改提交记录

6、index.html

入口页面

7、package.json

依赖包文件

8、readme.md

项目介绍

9、ts.config

ts 配置文件

10、vite.config.ts

vite配置文件

Logo

腾讯云面向开发者汇聚海量精品云计算使用和开发经验,营造开放的云计算技术生态圈。

更多推荐