vue3 + vite 安装配置及项目创建

一、安装vue

VUE官网:https://cn.vuejs.org/,它有两种方法进行安装,第一种通过<script> 标签 CDN 引入方式。关键代码如下:

复制代码
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>

第二种方法则是通过npm命令进行安装,其中命令如下所示。

复制代码
npm install vue -g

执行命令截图如下所示

二、安装Vite

其中Vite的官网地址:https://www.vitejs.net/,安装命令如下所示:

复制代码
npm install vite -g create-vite

安装截图如下所示。

三、用Vite创建项目

首先进入项目的目录,通过如下命令进行创建项目:create-vite app,通过vscode打开项目文件夹,进入到项目目录,其中截图如下所示

通过键盘上下键选择Vue,点回车

通过键盘上下键选择TypeScript,点回车

四、进入项目安装依赖

通过cd进入app目录,输入命令npm install 进行安装。

安装成功结果如下

五、启动app项目

在项目目录中执行命令npm run dev

在浏览器中输入http://localhost:5173/进行访问

相关推荐
90后的晨仔16 分钟前
uni-app 在 iOS 平台跳转页面时移除底部安全区域的完整技术指南
前端
用户9385156350723 分钟前
React + JWT 登录鉴权底层原理与工程化实践
前端·react.js
zww894911126 分钟前
家政派单系统开发实战:架构设计与派单算法指南
前端·系统架构
fangzhanpeng1681 小时前
(前端)2.js变量作用域样例
开发语言·前端·javascript
赵广陆1 小时前
企业实战:web服务集成
前端·pycharm·fastapi
demo007x1 小时前
Hermes-Agent 技术架构
前端·后端·agent
Flynt1 小时前
我扒了Fantastic-admin 6.0的源码,聊聊"AI时代版本答案"这个称号
vue.js·ai编程·cursor
码艺-Alimjan3 小时前
Vue项目源码备份最佳实践:无视node_modules,打包体积仅2MB
前端·javascript·vue.js
隔窗听雨眠3 小时前
esbuild构建工具简介:重新定义前端构建速度的极速打包器
前端