Vue3.0快速使用 vite创建Vue3.0

最新推荐文章于 2025-01-04 09:02:27 发布
转载 最新推荐文章于 2025-01-04 09:02:27 发布 · 408 阅读 · 0 ·
CC 4.0 BY-SA版权
原文链接：https://blog.csdn.net/qq_37167086/article/details/105587495?utm_medium=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-1.channel_param&depth_1-utm_source=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-1.channel
文章标签：

#vue

本文介绍如何从 Vue 2.0 升级到 Vue 3.0 版本，包括使用 vue-cli 或 vite 创建新项目的步骤。通过简单的命令行操作，开发者能够快速上手 Vue 3.0 的新特性。

vue3.0 API文档地址： https://vue-composition-api-rfc.netlify.app/

1.vue/cli 3以上

2.新建一个项目 vue create vue3-2020-4-17（该项目仍然是2.0）

在这里插入图片描述

3.使用vue add vue-next命令，将项目升级为3.0（如果报错可以尝试将vuecli升级到最新版本）

在这里插入图片描述

或者直接使用 vite 创建Vue3.0项目

npm i vite

npm init vite-app <project-name>

cd <project-name>

npm install

npm run dev
精选资源
Vue 3.0+Vite 2.0+Vue-Router4.0+Element-Plus+Echarts 5.0后台管理系统
05-02
Vue 3.0+Vite 2.0+Vue-Router4.0+Element-Plus+Echarts 5.0+Axios 开发的后台管理系统 Vue 3.0+Vite 2.0+Vue-Router4.0+Element-Plus+Echarts 5.0+Axios 开发的后台管理系统 Vue 3.0+Vite 2.0+Vue-Router4.0+...
(源码)基于Vue 3.0+和Vite的组件库系统.zip
最新发布
04-17
# 基于Vue 3.0+和Vite的组件库系统 ## 项目简介 本项目旨在为开发者提供便捷创建与使用组件库的方式，助力搭建快速开发环境，让使用者清晰理解各组件的使用方法。项目运用Vue 3.0+、Vite和TypeScript开发，保障了...
vite 搭建Vue3.0项目
sxiaobi
11-05 1221
1、全局安装vite：npm install create-vite-app -g 2、创建项目：npx create-vite-app project-name 3、cd project-name -> npm install -> npm run dev 4、至此项目搭建完毕， 浏览器访问：http://localhost:3000/ 5、npm install vue-router@next -S 安装路由，并且配置路由文件 history: createWebHashHistory(
vite 搭建 Vue3.0项目
假装是个web dog
10-16 6929
vite 搭建 Vue3.0项目vue3.0+TS+AntDesignVue项目vite初始化vite项目配置项目配置typescript配置Vue Router配置Vuex配置Ant Design Vue vue3.0+TS+AntDesignVue项目 vite vite是尤大大在今年新鼓捣出来的一个工具 为什么尤大大要推出vite，在使用webpack的时候，每次开发启动项目都比较慢，而且热更新也比较慢，而vite的主要特点就是快，官网对于vite的特点是这样描述的 1、快速的冷启动 2、即时的模块热
vite创建vue3.0项目
小可桢的博客
12-04 511
1.在你想创建的项目里，Shift+鼠标右键打开PowerShell窗口 npm init vite-app 项目名字 2.你希望项目跑起来，就先cd 到 c1中 3.然后npm install 安装依赖包 4.最后 npm run dev 就可以运行 5.最后打开浏览器输入上面的地址，就能看到下面这个项目运行成功了 ...
Vite创建Vue3项目
热门推荐
weixin_50117915的博客
01-16 1万+
Vite创建Vue3项目
Vite快速搭建Vue3.0项目
qq_45144924的博客
01-07 1116
Holle，大家好，最近发现Vue3.0版本都正式发布，然后去学习了一下，发现确实有很多和Vue2.0不一样的东西，下面呢，是Vue3.0推出的一个快速创建项目的管理工具——Vite！ #全局安装# npm install -g create-vite-app 进入想要创建项目的目录下新建 create-vite-app yourProjectName 进入新建的项目下安装相关依赖并运行 到这步项目就创建完成了，有没有发现创建项目特别快，比webpack快很多，当然啦，项目里后期需要什么东西需要自己在
精选资源
vue3.0-vite-antd 实现动态切换主题.zip
10-29
在Vue3.0框架中，配合Vite构建工具和Ant Design Vue 2.0库，实现动态主题切换是一项常见的需求，特别是在开发具有高度定制化界面的Web应用时。本项目"vue3.0-vite-antd 实现动态切换主题.zip"提供了一种实现方式，...
如何使用vite创建vue3.0项目
我的博客
12-12 590
一、首先系统需要有node环境。
精选资源
Vue3.0配置多页面应用
03-17
Vue3.0是一个备受瞩目的前端框架更新，它引入了许多新特性和性能优化，使得开发者在构建复杂Web应用时更加高效。"Vue3.0配置多页面应用"是指利用Vue3.0框架来开发包含多个独立入口的Web应用程序，每个入口对应一个...
分享一篇使用 Vite 创建 Vue3 项目的入门指南
前端达人
08-26 473
前言vite是下一代前端开发与构建工具，目前官方推荐使用vite来构建项目。下面我们来看看如何创建vue3项目。创建项目官方提供了多种创建命令，如下：npm init vite@latest yarn create vite pnpm create vite根据自己的情况选择合适的命令即可，我使用的是pnpm，所以：pnpm create vite然后会让给你输入一个项目名称。再选择一个f...
vite +vue3.0项目
waillyer的博客
09-07 310
安装 vitejs #npm 6.x npm init vite@latest my-vue-app --template vue #npm 7+, 需要额外的双横线： npm init vite@latest my-vue-app – --template vue yarn yarn create vite my-vue-app --template vue 使用 ant-design 文档https://2x.antdv.com/components/overview-cn/ yarn add
Vue3.0 + Vite 搭建 + API详解【持续更新】
weixin_44216637的博客
05-15 3388
api + 性能提升
Vue3.0教程002：创建Vue3项目
WwLK123的博客
01-04 857
创建Vue3.0项目，以及Vue的简单使用。
使用 vite 创建工程
weixin_42087515的博客
07-02 384
官方文档：https://v3.cn.vuejs.org/guide/installation.html#vite vite官网：https://vitejs.cn/ 安装步骤： 演示 win+r 打开,输入cmd确定 创建工程
通过vite创建项目
m0_74356429的博客
04-03 3800
1.安装vite: npm install -g vite@latest2.创建项目： npm init vite@latest 项目名称 -- --template vue-ts3. cd 到项目目录之后运行。
前端项目练习——用Vite创建Vue3.0项目
weixin_45524929的博客
09-05 278
切换为淘宝镜像：npm config set registry https://registry.npm.taobao.org。1.用vite新建Vue3工程项目。，得到以下结果，即完成安装。
vue3.0+vite初体验
MrGuange_的博客
03-29 1196
1、准备工作 node版本要在12.0.0以上 2、创建项目 npm init vite@latest ![输入项目名称](https://img-blog.csdnimg.cn/7c5cd7237cc34f959086abefb992517d.png#pic_center) ![选择框架](https://img-blog.csdnimg.cn/9c7269a45a36464887a54adec424b651.png?x-oss-process=image/watermark,type_d3F5LXpl
vite搭建Vue3.0项目尝试
ZWWwei的博客
03-30 1331
Vue3.0开始新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入 开始 最近项目不太紧张，终于可以尝试上手3.0了， 附上3.0的文档位置链接: Vue3.0. Vitejs 新的改变 我们对Markdown编辑器进行了一些
快速搭建Vue3.0项目：Vite与TS整合实践
Vue + Vite + TypeScript项目搭建包提供了完整的环境配置，可以快速搭建起一个基于Vue3.0、Vite和TypeScript的前端项目。项目搭建包包含了必要的配置文件，如vite.config.ts、tsconfig.json等，以及一些基础的代码...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值