使用Vite构建Vue3+TypeScript项目

1,新建项目前,确保电脑

已经安装Node.js,pnpm

在本地新建一个文件夹 ,在文件路径输入cmd 如下展示

2,执行如下指令搭建项目 filename,即搭建的项目名称。

pnpm  create vite@latest filename

输入指令按回车之后如下图展示: 

 选择 vue之后回车显示如下:

选择TypeScript 回车之后显示如下:

 3:按照下图 123步序指令执行即可

cd tsadmin 进入文件  pnpm  install  安装依赖    pnpm run  dev 运行项目指令 

打开http://localhost:5173/ 即可效果展示如下

4,还有另外一种方法 使用vscode打开项目

新建终端如下展示 ,

在终端输入上面123步同样可以安装依赖运行项目。 

 5:关于vue-element-plus-admin 打开 vue-element-plus-admin点击在线预览,很详细的项目实例

若发现有问题,请指正,谢谢!

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

29个社媒营销经典案例!外贸人速来学习!

今天给大家分享一些比较经典的外贸社媒营销案例,希望对大家有帮助! 01 创建重复的内容系列 如果你每天都在为决定要在社交媒体上发布什么内容而焦头烂额,那就创建一些你擅长的重复内容系列和主题。 例如,有人经常分享鼓舞人心的…

EDM营销怎么做才能提高转化率?怎么策划?

EDM营销怎么做才能达到最大效果?如何成功制定EDM营销策略? EDM营销仍然是企业营销策略中不可或缺的一环。然而,仅仅发送电子邮件并不足以保证高转化率,EDM营销怎么做才能真正达到预期效果呢?接下来,AokSen…

【Python】一文详细介绍plt.rcParams 在 Matplotlib 中的原理、作用、注意事项

【Python】一文详细介绍plt.rcParams 在 Matplotlib 中的原理、作用、注意事项 🌈 个人主页:高斯小哥 🔥 高质量专栏:Matplotlib之旅:零基础精通数据可视化、Python基础【高质量合集】、PyTorch零基础入门教程&#x…

【完美实现】VITE + VUE3 + SVG图片解析+element-plus开发环境初始化(基于macos)

一、最终效果 废话少说,直接上效果 这是我的初始化程序提供的页面,在这个页面上实现了一下几个功能: 1、vite初始化之后的路由安装和初始化; 2、标准SVG的解析,并可调整大小、颜色; 3、element-plus的安…

wsl2安装docker以及nvidia-docker

前提 想在wsl2(Ubuntu20.04)环境中使用docker以及nvidia-docker来编译一些程序,这里对安装过程进行记录。 注意:wsl2中的安装docker和物理机器上安装docker的过程并不相同。因为wsl2方式的ubuntu里面没有systemd,所以通过apt insta docker-…

信息系统项目管理师--成本管理

项⽬成本管理重点关注完成项⽬活动所需资源的成本,但同时也考虑项⽬决策对项⽬产品、服务或成果的使⽤成本、维护成本和⽀持成本的影响。不同的⼲系⼈会在不同的时间,⽤不同的⽅法 测算项⽬成本。 就某些项⽬,特别是⼩项⽬⽽⾔,成…

【docker】docker部署java web项目

docker部署java web项目 一、docker操作centos及docker设置entos yum 设置配置docker镜像加速器 二、image 镜像操作拉镜像导出镜像删除本地镜像加载本地镜像 三、container 容器操作Nginx容器示例Redis容器示例 docker数据卷的使用自定义镜像构建镜像 实践代码编写Dockerfile制…

如何解决ChatGPT消息发不出问题,GPT消息无法发出去,没有响应的问题

前言 今天工作到一半,登陆ChatGPT想咨询一些代码上的问题,结果发现发不了消息了。 ChatGPT 无法发送消息,但是能查看历史的对话。不过首先可以先打开官方的网站:https://status.openai.com/ 。 查看当前Open AI的状态&#xff0…

Intel@cpu产品参数和命名@单核睿频和全核睿频

文章目录 选择合适的cpuintel cpu型号和命名小结 cpu排行时钟速度睿频单核睿频和全核睿频网络上流传的方法 在线查询 产品比较跑分比较 选择合适的cpu 如何选择游戏 CPU - 英特尔 (intel.cn)在决定购买具体的产品之前,建议广泛地查阅用户对它的评价以及是否有哪些因素是不满足…

Deep Learning for Detecting Robotic Grasps

链接:1301.3592.pdf (arxiv.org) 这个用于从单一RGB-D视图进行机器人抓取检测的算法包括以下步骤: 图像获取: 机器人获取包含待抓取对象的场景的RGB-D图像。 抓取评分: 使用小型深度网络对RGB-D图像中的潜在抓取进行评分。抓取以在…

一次直播和图像识别技术应用的探索之旅

背景 Think Better 很多行业都在“卷”,作为金融科技行业的信也,也不例外。除了卷云计算、大数据和人工智能这些非常有深度的技术以外,信也向着技术融合创新的方向逐步探索,做得更好一些,为用户提供更好的价值&#xf…

掼蛋的牌型与规律(下篇)

一、三不带 一般出三不带有几种情况:没有对子配、对子和三张数量不匹配、对子成了三连对、对子太大。作为发牌方,首发三不带可以迷惑对手。三不带打出来很难处理,如果接了三不带可能就会将小对子留下,不接又不甘心让对方继续有出牌…

pip 和conda 更换镜像源介绍

1、前言 很多深度学习的项目免不了安装库文件、配置环境等等,如果利用官方提供的连接,网速很慢,而且很容易download掉。 所以配置好了虚拟环境,将pip换源属实重要 常见的国内镜像源有清华、中科大、阿里等等... 这里建议用中科…

力扣每日一题 找出数组的第 K 大和 小根堆 逆向思维(TODO:二分+暴搜)

Problem: 2386. 找出数组的第 K 大和 文章目录 思路复杂度💖 小根堆💖 TODO:二分 暴搜 思路 👨‍🏫 灵神题解 复杂度 时间复杂度: 添加时间复杂度, 示例: O ( n ) O(n) O(n) 空间复杂度: 添加空间复杂…

​如何防止网络攻击?

应对不同类型网络攻击的最佳途径是“知己”、“知彼”,在了解它们的工作原理、能够识别其手段、方法及意图的前提下,找出针对性的应对文案。今天,就为大家总结以下防止不同类型网络攻击的有效方法,希望无论是对个人、还是企业和组…

计算机网络—以太网接口和链路配置

目录 1.拓扑图 2.以太网交换机基础配置 3.配置手动模式的链路聚合 4.配置静态 LACP 模式的链路聚合 5.配置文件 1.拓扑图 2.以太网交换机基础配置 华为交换机接口默认开启了自协商功能,需要手动配置S1与 S2上G0/0/9和G0/0/10接口的速率。 首先修改交换机的设…

C# 中 Replace 字符串操作方法

在 C# 中,Replace 是一个字符串操作方法,用于替换字符串中的指定字符或子字符串。它接受两个参数:要查找和替换的字符串。Replace 方法在源字符串中查找所有匹配的字符或子字符串,并用指定的替换字符串进行替换。 下面是 Replace…

POS 之 最终确定性

Gasper Casper 是一种能将特定区块更新为 最终确定 状态的机制,使网络的新加入者确信他们正在同步规范链。当区块链出现多个分叉时,分叉选择算法使用累计投票来确保节点可以轻松选择正确的分叉。 最终确定性 最终确定性是某些区块的属性,意味…

蜂窝物联智慧大棚整体解决方案

一、项目背景 温室大棚在不适宜植物生长的季节,能提供生育期和增加产量,多用于低温季节喜温蔬菜、花卉、林木等植物栽培或育苗等。因此对种植作物生长环境的要求要精确的多。 大多数农户加温、浇水、通风等,全凭感觉。人感觉冷了就加温&…

部署wordpress项目

项目wordpress 实验目的: 熟悉yum和编译安装操作 锻炼关联性思维,便于以后做项目 nginx 编译安装 1、安装源码包 [rootlinux-server ~]# yum -y install gcc make zlib-devel pcre pcre-devel openssl-devel [rootlinux-server ~]# wget http://nginx.…