vite 脚手架搭建 vue3 项目

一、版本

node 版本:18.11.0

二、创建前准备

如果还未安装 vite 需先安装:

1、win+r,输入 cmd 进入命令提示符窗口,输入以下命令全局安装vite

npm install -g vite

2、查看安装成功后的 vite 版本

npm list vite

在这里插入图片描述

三、步骤

1、win+r,输入 cmd 进入命令提示符窗口

2、cd 到项目需要存放的目录

3、进入目录后,使用以下命令搭建项目(这里以npm为例),回车

npm create vite@latest

其他安装方式命令:

yarn:yarn create vite
pnpm:pnpm create vite
bunx: bunx create-vite

在这里插入图片描述

4、输入项目名称及包名称,输入完成后回车

在这里插入图片描述

5、之后会弹出可搭建的框架类型,通过上下键选中 Vue 后回车

在这里插入图片描述

6、选择项目的编程语言,根据自身需求选中后回车

在这里插入图片描述

6、项目创建成功后,按照提示操作

在这里插入图片描述

(1)npm install:安装项目依赖
(2)npm run dev:运行项目

7、运行成功后,将网址复制到浏览器打开即可

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/439942.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

添加了gateway之后远程调用失败

前端提示500,后端提示[400 ] during [GET] to [http://userservice/user/1] 原因是这个,因为在请求地址写了两个参数,实际上只传了一个参数 解决方案:加上(required false)并重启所有相关服务

老铁,公网访问局域网,一起游戏远程联机

下载地址 Windows 64位 (切勿直接在压缩文件中操作,全部解压到一处后再操作,请关闭某60(会胡乱拦截),可用其他任意安全软件)Mac OS X 64位 (给fastnat执行权限 chmod x ./fastnat.. 终端运行二进制,自行百度)Linux 64位 (给fastnat执行权限 chmod x ./fastnat..)Linux/ARM 32位…

inode生命周期

1.添加inode到inode cache链表 当inode的引用计数器i_count为0后,会调用iput_final去释放 static void iput_final(struct inode *inode) {struct super_block *sb inode->i_sb;const struct super_operations *op inode->i_sb->s_op;unsigned long sta…

Flask 入门1

1. 关于 Flask Flask诞生于2010年, Armin Ronacher的一个愚人节玩笑。不过现在已经是一个用python语言基于Werkzeug工具箱编写的轻量级web开发框架,它主要面向需求简单,项目周期短的小应用。 Flask本身相当于一个内核,其他几乎所…

提升工作效率,畅享便捷PDF编辑体验——Adobe Acrobat Pro DC 2023

作为全球领先的PDF编辑软件,Adobe Acrobat Pro DC 2023将为您带来前所未有的PDF编辑体验。无论您是个人用户还是企业用户,Adobe Acrobat Pro DC 2023将成为您提高工作效率、简化工作流程的得力助手。 一、全面编辑功能 Adobe Acrobat Pro DC 2023提供了…

FPGA光纤Aurora_8B_10B

本章基于Vivado开发工具中Aurora的IP核进行验证。 本章包括了光纤眼图的验证、单个Aurora核下板验证、两个Aurora核下板验证。 光纤接口眼图验证 在协议的选项中,本次实验采用的是 Custom (自定义模式)。 Line Rate (行速率)选项在 QPLL/CPLL 都支持的情况下带…

数字图像处理(实践篇)三十六 OpenCV-Python 使用ORB和BFmatcher对两个输入图像的关键点进行匹配实践

目录 一 涉及的函数 二 实践 ORB(Oriented FAST and Rotated BRIEF)是一种特征点检测和描述算法,它结合了FAST关键点检测和BRIEF描述子。ORB算法具有以下优势: ①实时性:能够在实时应用中进行快速的特征点检测和描述。 ②

对鸢尾花进行分类预测-----pycharm

项目说明 #项目: 对鸢尾花进行分类预测 #实例数量150个(3类各50个) #属性数量:4(数值型,数值型,帮助预测的属性和类) #特征:花萼长度,花萼宽度,花瓣长度,花瓣宽度 单位&#xff1…

【C++】类和对象(一)

💗个人主页💗 ⭐个人专栏——C学习⭐ 💫点击关注🤩一起学习C语言💯💫 目录 导读1. 面向对象2. 类2.1 类的定义 3. 类的访问限定符4. class与struct定义类的区别5. 类的封装6. 类的作用域7.类的实例化8. 类的…

C语言菜鸟入门·判断语句(if语句、if...else语句、嵌套if语句)详细介绍

目录 1. if语句 2. if...else语句 3. if...else if...else 语句 4. 嵌套if语句 C 语言把任何非零和非空的值假定为 true,把零或 null 假定为 false。 语句描述if语句一个 if 语句 由一个布尔表达式后跟一个或多个语句组成。if...else语句一个 if 语句 后可跟…

MySQL解决 恢复从备份点到灾难点之间数据(不收藏找不到了)

CSDN 成就一亿技术人! 今天分享一期 mysql中 备份之后发生灾难造成数据丢失 那么如何恢复中间的数据呢? 数据库数据高于一切(任何数据是不能丢失的) CSDN 成就一亿技术人! 目录 1.准备测试数据库 2.备份数据库 观…

vue 使用 v-viewer 用于图片浏览的Vue组件,支持旋转、缩放、翻转等操作,基于viewer.js。

作者连接 npm: npm install v-viewerlegacy viewerjs main.js 引入: // 引入Viewer插件 import VueViewer, { directive as viewerDirective } from v-viewer; // 引入Viewer插件的图片预览器的样式 import viewerjs/dist/viewer.css; // 使用Viewer图片…