vite+vue3+element-plus

vite+vue3+element-plus

1.开始

npm create vite@latest app -- --template vuenpm installlnpm run dev

2.引入element-ui

npm install element-plus
修改main.js
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
createApp(App).use(ElementPlus).mount('#app')

3.安装vue-router

npm install vue-router@4
修改main.js
import router from "./router"
不识别@
npm i @types/node -D
修改vue.config.js

import { resolve } from 'path'export default defineConfig {// ...resolve: {alias: {"@": resolve(__dirname, 'src'), // 路径别名},extensions: ['.js', '.json', '.ts'] // 使用路径别名时想要省略的后缀名,可以自己 增减}
}
index.js
import { createRouter, createWebHistory } from "vue-router"
import Index from '@/view/index/index.vue'const router = createRouter({history: createWebHistory(),routes : [{ path: '/', redirect: '/index' },{path: '/',name:'index',component: () => import('../view/index/index.vue'),children:[{path: '/index',name: 'index',component: Index}]}]
})export default router

在这里插入图片描述

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

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

相关文章

BlueStore BlueFS rocksdb 关联性梳理

Tag: ceph 12.2.4 BlueStore空间初始化 BlueStore磁盘空间管理 总述 OSD挂载目录基于文件系统管理,Slow、WAL、DB空间区域基于裸盘管理;Slow区域:此类空间主要用于存储对象数据,由BlueStore管理,其中分配于BlueFS空…

AI篇-chatgpt基本用法(文心一言也适用)

目录 (1)基本规则 (2)例子1-文章摘要 (3)例子2-代码生成 (4)文心一言链接 (1)基本规则 相比于搜索引擎,ChatGPT的优势在于其高效的想法关联和…

MyBatisPlus之DQL编程控制

🐌个人主页: 🐌 叶落闲庭 💨我的专栏:💨 c语言 数据结构 javaEE 操作系统 石可破也,而不可夺坚;丹可磨也,而不可夺赤。 MyBatisPlus之DQL编程控制 一、 条件查询方式&…

Spring项目配置

1.创建项目 2.修改编码格式为UTF-8 3.检查或配置代码⾃动补全功能 4.检查或配置⾃动导包 5.检查或配置Maven,可以⽤国内仓库镜像 6.idea识别Maven项⽬:在Notifications视图中会提⽰Load Maven Project,点击即可。 7.开启热部署 a.确认 pom.x…

EasyPOI处理excel、CSV导入导出

1 简介 使用POI在导出导出excel、导出csv、word时代码有点过于繁琐,好消息是近两年在开发市场上流行一种简化POI开发的类库:easyPOI。从名称上就能发现就是为了简化开发。 能干什么? Excel的快速导入导出,Excel模板导出,Word模板导出,可以…

无涯教程-JavaScript - SECOND函数

描述 SECOND函数返回时间值的秒数。第二个数字以0(零)到59之间的整数形式给出。 语法 SECOND (serial_number)争论 Argument描述Required/OptionalSerial_number 您想找到包含秒数的时间。 时间可以输入为- 引号内的文本字符串(如" 6:45 PM") 十进制数(如0.7812…

LCD驱动电路IC简述

Panel 模块驱动图示 1.Panel内部驱动 2.驱动原理框图 2.1.1 TCON(Timing Controller):时序控制器。主要功能为数据的转换及时序控制信号生成。 2.2.2 Gate控制信号工作时序 OE1 (output enable):输出控制使能信号。OE2(Multi Level Gate)&…

数字化新零售平台系统提供商,门店商品信息智慧管理-亿发进销存

传统的批发零售业务模式正面临着市场需求变化的冲击。用户日益注重个性化、便捷性和体验感,新兴的新零售模式迅速崛起,改变了传统的零售格局。如何在保持传统业务的基础上,变革发展,成为了业界亟需解决的问题。 在这一背景下&…

AP51656 LED车灯电源驱动IC 兼容替代PT4115 PT4205 PWM和线性调光

产品描述 AP51656是一款连续电感电流导通模式的降压恒流源 用于驱动一颗或多颗串联LED 输入电压范围从 5V 到 60V,输出电流 可达 1.5A 。根据不同的输入电压和 外部器件, 可以驱动高达数十瓦的 LED。 内置功率开关,采用高端电流采样设置 …

Docker的数据管理(持久化存储)

文章目录 一、概述二、数据卷三、数据卷容器四、端口映射五、容器互联(使用centos镜像)总结 一、概述 管理 Docker 容器中数据主要有两种方式:数据卷(Data Volumes)和数据卷容器(DataVolumes Containers&a…

Spark 环境安装与案例演示

Spark 环境安装 一、准备工作 1、hadoop成功安装 2、防火墙关闭 二、解压安装 1、上传 spark 安装包到/tools 目录,进入 tools 下,执行如下命令: tar -zxvf spark-2.1.0-bin-hadoop2.7.tgz -C /training/由于 Spark 的脚本命令和 Hadoop…

Astro建站教程:安装nodejs,npm下载Astro,安装扩展

下载Nodejs LTS版:https://nodejs.org/en 安装步骤全默认即可,安装路径可以根据自己的爱好更改在桌面右键打开cmd或powershell,输入node -v和npm -v测试是否安装成功 浏览器打开https://docs.astro.build/en/install/auto/ 复制里面的npm cre…

OB Cloud助力泡泡玛特打造新一代分布式抽盒机系统

作为中国潮玩行业的领先者,泡泡玛特凭借 MOLLY、DIMOO、SKULLPANDA 等爆款 IP,以及线上线下全渠道营销收获了千万年轻人的喜爱,会员数达到 2600 多万。2022 年,泡泡玛特实现 46.2 亿元营收,其中线上渠道营收占比 41.8%…

找redis大key工具rdb_bigkeys

github官网 https://github.com/weiyanwei412/rdb_bigkeys 在centos下安装go [roothadoop102 rdb_bigkeys-master]# wget https://dl.google.com/go/go1.13.5.linux-amd64.tar.gz [roothadoop102 rdb_bigkeys-master]# tar -zxf go1.13.5.linux-amd64.tar.gz -C /usr/local将g…

【开发问题系列】CSV转Excel

💝💝💝欢迎来到我的博客,很高兴能够在这里和您见面!希望您在这里可以感受到一份轻松愉快的氛围,不仅可以获得有趣的内容和知识,也可以畅所欲言、分享您的想法和见解。 推荐:kuan 的首页,持续学…

element+vue table表格全部数据和已选数据联动

1.组件TableChoose <template><div class"tableChooseBox"><div class"tableRow"><div class"tableCard"><div class"tableHeadTip">全部{{ labelTitle }}</div><slot name"body" …

Sentry 是一个开源的错误监控和日志聚合平台-- 通过docker-compose 安装Sentry

概述 Sentry 是一个开源的错误监控和日志聚合平台&#xff0c;用于帮助开发团队实时监控和调试应用程序中的错误和异常。它可以捕获应用程序中的错误和异常&#xff0c;并提供详细的错误报告&#xff0c;包括错误堆栈跟踪、环境信息、用户信息等。这些报告可以帮助开发团队快速…

CVE-2023-28303(截图修复)

在做羊城杯的misc的时候发现了一个图片&#xff0c;典型的图片高度不对&#xff0c;修改之后对图片的高度进行不断修改尝试&#xff0c;发现图片很大&#xff0c;但是内容没有出现&#xff0c; 从这里指知道存在feld文件x 截出zip文件内容&#xff0c;把04 03 改为03 04 这里的…

RabbitMQ快速上手及讲解

前言&#xff1a;在介绍RabbitMQ之前&#xff0c;我们先来看下面一个场景&#xff1a; 1.1.1.1 异步处理 场景说明&#xff1a; 用户注册后&#xff0c;需要发注册邮件和注册短信&#xff0c;传统的做法有两种 1.串行的方式 (1)串行方式&#xff1a;将注册信息写入数据库后&a…

Docker使用数据卷挂载进行数据存储与共享

一、挂载和数据卷 在 Docker 中&#xff0c;挂载&#xff08;Mounting&#xff09;和数据卷&#xff08;Data Volumes&#xff09;是用于在容器和宿主机之间共享数据的机制。 挂载&#xff1a;将宿主机文件系统中的目录或文件与容器中的目录或文件进行关联的过程。数据卷&…