一、创建Vue3项目

1. 下载 node.js

下载地址:https://nodejs.org/zh-cn 优先选择 16 版本;

node -v || node -version 可以检查本地 node.js 版本

2. 设置淘宝镜像源

npm config set registry https://registry.npmmirror.com/ 设置淘宝镜像源

npm config get registry 查看当前镜像源

3. 创建项目快速上手 | Vue.js

npm create vue@latest

4. 运行项目

 在VSCode中打开项目文件

npm install 安装依赖

npm run dev 运行项目

打开链接

效果图

5.清理项目初始文件

选中文件可以直接删掉

App.Vue

<script setup lang="ts">
import { RouterView } from "vue-router";
</script><template><RouterView />
</template><style scoped></style>

HomeView.Vue

<script setup lang="ts">
</script><template><p>首页</p>
</template>

 router/index.ts

import { createRouter, createWebHistory } from "vue-router";const router = createRouter({history: createWebHistory(import.meta.env.BASE_URL),routes: [{path: "/",name: "home",component: () => import("../views/HomeView.vue"),},],
});export default router;

效果

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

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

相关文章

如何获得《幻兽帕鲁》隐藏帕鲁唤夜兽?13000个配种配方查询 幻兽帕鲁Steam好评率还在涨 Mac苹果电脑玩幻兽帕鲁 Crossover玩Windows游戏

《幻兽帕鲁》是一款Steam平台热门游戏&#xff0c;开放式大陆和养成式冒险结合&#xff0c;成为2024首款热门游戏&#xff0c;不过由于官方仅发布了Windows版的游戏客户端&#xff0c;Mac用户无法直接玩&#xff0c;好在有Crossover这样的神器&#xff0c;让苹果电脑也能玩上《…

JavaScript 基础 (二)

文章目录 JavaScript 基础 &#xff08;二&#xff09;一.运算符1.1 **算术运算符**1.1.1 基础1.1.2 算术运算符执行的优先级顺序1.1.3 小结 1.2 **赋值运算符**1.2.1 基础1.2.2 小结 1.3 **一元运算符**1.3.1 基础1.3.2 小结 1.4 **比较运算符**1.4.1 比较运算符的介绍1.4.2 比…

如何改变音频的频率教程

这是一篇教你如何通过一些工具改变音频频率的教学文章。全程所用的软件都是免费的。 本文用到的软件&#xff1a; AIX智能下载器 用于抓取任何视频网站资源的插件 格式工厂 将mp4转化为mp3 Audacity 改变音频频率的软件 如果你已备好mp3或其他格式的音频&#xff0c;那么直接看…

flutter module打包成framework引入原生工程

Flutter - 将 Flutter 集成到现有项目&#xff08;iOS - Framework篇&#xff09; 本篇文章大幅参考了 caijinglong 大佬的总结文章&#xff1a; 把flutter作为framework添加到已存在的iOS中[1] 用 Flutter 来开发&#xff0c;从来都不可能是新开的一个纯 Flutter 项目&#xf…

Ubuntu22.04 网络图标突然消失

本来好好的&#xff0c;突然就发现没有网络了&#xff0c;图标也不见了。 特别是Ubuntu虚拟机&#xff0c;容易出现此问题。 修复办法 1. sudo service network-manager stop2. sudo rm /var/lib/NetworkManager/NetworkManager.state3. sudo service network-manager start到…

【STM32CubeMX】生成代码错误

1、不能有中文路径 参考博客&#xff1a; http://t.csdnimg.cn/OdYi2 生成的代码已经帮忙初始化&#xff0c;只需修改main函数的while&#xff08;1&#xff09;即可&#xff1a; 2、有可能是Java环境版本不对 我安装的时候操作正确

The Rise and Potential of Large Language Model Based Agents: A Survey 中文翻译

大型语言模型代理的崛起与潜力&#xff1a;综述 摘要 长期以来&#xff0c;人类一直追求与或超越人类水平的人工智能&#xff08;AI&#xff09;&#xff0c;而人工智能代理被视为实现这一目标的有希望的方式。人工智能代理是感知环境、做出决策并采取行动的人工实体。已经有…

林浩然探索庄子美妙哲学境界

林浩然探索庄子美妙哲学境界 Lin Haoran Explores the Sublime Philosophical Realm of Zhuangzi 在现代社会这个信息洪流中&#xff0c;犹如一片繁华喧嚣的都市丛林&#xff0c;青年学者林浩然却如一只挣脱了世俗束缚的鲲鹏&#xff0c;以其独特的视角和深邃的思考&#xff0c…

TensorFlow2实战-系列教程7:TFRecords数据源制作1

&#x1f9e1;&#x1f49b;&#x1f49a;TensorFlow2实战-系列教程 总目录 有任何问题欢迎在下面留言 本篇文章的代码运行界面均在Jupyter Notebook中进行 本篇文章配套的代码资源已经上传 1、TFRecords 在训练过程中&#xff0c;基本都是使用GPU来计算&#xff0c;但是取一个…

易点易动设备管理平台助力制造企业实现设备的能耗监控

在当今注重环保和可持续发展的时代&#xff0c;能源消耗成为制造企业关注的重要问题。为了提高能源利用效率和降低能源成本&#xff0c;制造企业需要对设备的能耗进行有效监控和管理。易点易动设备管理平台作为一款智能化设备管理解决方案&#xff0c;为制造企业提供了全面的能…

Java 枚举enum类

Java枚举&#xff08;Enum&#xff09; 枚举 定义&#xff1a; Java枚举是一种特殊的类&#xff0c;用来表示一组固定的常量。 被enum关键字修饰的类型就是枚举类型 &#xff08;如果枚举不添加任何方法&#xff0c;枚举值默认为从0开始的有序数据。 比如定义一个枚举类表示…

【C语言】位操作符详解

目录 1、按位与&#xff08; & &#xff09; 2、按位或&#xff08; | &#xff09; 3.按位异或&#xff08; ^ &#xff09; C语言中的位操作符有以下&#xff1a; & | ^//按位与 //按位或 //按位异或 位运算符是计算两者之间的补码&#xff0c;然后得到的是计算后补…

防御保护----防火墙基本知识

一.防火墙的基本知识--------------------------------------------------------- 防火墙&#xff1a;可以想象为古代每个城市的城墙&#xff0c;用来防守敌军的攻击。墙&#xff0c;始于防&#xff0c;忠于守。从古至今&#xff0c;墙予人以安全之意。 防火墙的主要职责在于&…

ES实战回顾

1、你用的集群节点情况&#xff1f; 一个ES集群&#xff0c;18个节点&#xff0c;其中3个主节点&#xff0c;15个数据节点&#xff0c;500G左右的索引数据量&#xff0c;没有单独的协调节点&#xff0c;它的每个节点都可以充当协调功能&#xff1b; 2、你们常用的索引有哪些&a…

一个基于 .NET 7 + Vue.js 的前后端分离的通用后台管理系统框架 - DncZeus

前言 今天给大家推荐一个基于.NET 7 Vue.js(iview-admin) 的前后端分离的通用后台权限(页面访问、操作按钮控制)管理系统框架&#xff1a;DncZeus。 官方项目简介 DncZeus是一个基于 .NET 7 Vue.js 的前后端分离的通用后台管理系统框架。后端使用.NET 7 Entity Framework…

Mysql-事务(隔离级别,事务底层原理,MVCC)

什么是事务&#xff1f;有哪些特性&#xff1f; 事务&#xff1a;事务指的是逻辑上的一组操作&#xff0c;组成这组操作的各个单元要么全都成功&#xff0c;要么全都失败。 事务特性&#xff1a; 原子性&#xff08;Atomicity&#xff09;&#xff1a; 原子性是指事务是一个不…

设计模式——2_0 职责链(Chain of Responsibility)

楼下一个男人并得要死&#xff0c;那家隔壁的一家唱着留声机&#xff0c;对面是弄孩子。楼上有两人狂笑&#xff1b;还有打牌声&#xff0c;河中的船上有女人哭她死去的母亲。人类的悲欢并不相通&#xff0c;我只觉得他们吵闹 ——鲁迅 文章目录 定义图纸一个例子&#xff1a;如…

谷歌人工智能视频生成器-LUMIERE(未开源)

Google重磅发布视频生成模型Lumiere 据说后续会开源 亮点1.支持文本到视频与图像到视频 亮点2.画风迁移 亮点3.运动蒙版 亮点4.视频编辑 亮点5.视频修复 谷歌视频模型可以生成80帧的片段&#xff01;不仅画质好、质量高&#xff0c;而且时长更长。 视频局部编辑 这项功能可以…

强化学习原理python篇06(拓展)——DQN拓展

强化学习原理python篇06&#xff08;拓展&#xff09;——DQN拓展 n-steps代码结果 Double-DQN代码结果 Dueling-DQN代码结果 Ref 拓展篇参考赵世钰老师的教材和Maxim Lapan 深度学习强化学习实践&#xff08;第二版&#xff09;&#xff0c;请各位结合阅读&#xff0c;本合集只…

【学习笔记】vue3的watch

尚硅谷Vue2.0Vue3.0全套教程丨vuejs从入门到精通 课程 P152节 笔记&#xff1a; 情况一&#xff1a;监视ref所定义的一个响应式数据 情况二&#xff1a;监视ref所定义的多个响应式数据 这两种情况比较简单&#xff0c;正常写就ok&#xff1a; 情况三&#xff1a;监视reactive所…