当前位置: 首页 > news >正文

【vue2类型助手】vue2-cli 实现为 vue2 项目中的组件添加全局类型提示

实现 vue2 全局组件提示

vue2 项目全局注册组件直接使用没有提示

由于vue2中使用volar存在很大的性能问题,所以只能继续使用vetur,但是这样全局组件会没有提示,这对于开发来说,体验十分不友好,所以开发此cli并借助vetur帮助解决这个问题。

实现效果

hover 提示

在这里插入图片描述

属性和事件提示

在这里插入图片描述

在这里插入图片描述

使用

全局安装了@winches/vue2-cli

npm i -g @winches/vue2-cli

进入到项目使用的组件库导出入口文件,比如element-uiindex.js
在这里插入图片描述

复制该入口的相对路径和导出组件数组变量components

将其作为参数,随后在该组件库的根目录运行指令

vue2-cli vetur -p <导出组件文件相对路径> -n [components]

随后开始运行

在这里插入图片描述

运行成功后,会在本地生成一个vetur目录,将该目录移动到项目中

在这里插入图片描述

随后在package.json里添加上下面一段,然后重启vscode就可以看到效果了

{"vetur": {"tags": "./vetur/tags.json","attributes": "./vetur/attributes.json"}
}

额外功能 inject-hooks

项目多人协作的困扰

相信大家多多少少都遇到过,当主线分支的代码,合入到自己的分支的时候,如果这时候,主线中有一些依赖的更新或者添加或者删除,如果合入之后,没有及时的install的话,项目启动的时候,可能就会报错!

⭐️ hooks 功能

当检测到 lock 文件变更时,重新安装依赖

在这里插入图片描述

使用

进入到项目的根目录,随后运行下面指令

npx @winches/vue2-cli inject-hooks

或者全局安装运行

npm i -g @winches/vue2-cli
# 运行
vue2-cli inject-hooks

开始自动安装 git hooks

在这里插入图片描述

相关文章:

【vue2类型助手】vue2-cli 实现为 vue2 项目中的组件添加全局类型提示

实现 vue2 全局组件提示 vue2 项目全局注册组件直接使用没有提示 由于vue2中使用volar存在很大的性能问题&#xff0c;所以只能继续使用vetur&#xff0c;但是这样全局组件会没有提示&#xff0c;这对于开发来说&#xff0c;体验十分不友好&#xff0c;所以开发此cli并借助ve…...

mysql 索引 区分字符大小写

mysql 建立索引&#xff0c;特别是unique索引&#xff0c;是跟字符集、字符排序规则有关的。 对于utf8mb4_0900_ai_ci来说&#xff0c;0900代表Unicode 9.0的规范&#xff0c;ai表示accent insensitivity&#xff0c;也就是“不区分音调”&#xff0c;而ci表示case insensitiv…...

Stable Diffusion Webui源码剖析

1、关键python依赖 &#xff08;1&#xff09;xformers&#xff1a;优化加速方案。它可以对模型进行适当的优化来加速图片生成并降低显存占用。缺点是输出图像不稳定&#xff0c;有可能比不开Xformers略差。 &#xff08;2&#xff09;GFPGAN&#xff1a;它是腾讯开源的人脸修…...

为什么kafka 需要 subscribe 的 group.id?我们是否需要使用 commitSync 手动提交偏移量?

目录 一、为什么需要带有 subscribe 的 group.id二、我们需要使用commitSync手动提交偏移量吗&#xff1f;三、如果我想手动提交偏移量&#xff0c;该怎么做&#xff1f; 一、为什么需要带有 subscribe 的 group.id 消费概念&#xff1a; Kafka 使用消费者组的概念来实现主题的…...

什么是Web应用程序防火墙,WAF与其他网络安全工具差异在哪?

一、什么是Web 应用程序防火墙 (WAF) &#xff1f; WAF软件产品被广泛应用于保护Web应用程序和网站免受威胁或攻击&#xff0c;它通过监控用户、应用程序和其他互联网来源之间的流量&#xff0c;有效防御跨站点伪造、跨站点脚本&#xff08;XSS攻击&#xff09;、SQL注入、DDo…...

打家劫舍 II——力扣213

动规 int robrange(vector<int>& nums, int start, int end){int first=nums[start]...

动手学深度学习—卷积神经网络LeNet(代码详解)

1. LeNet LeNet由两个部分组成&#xff1a; 卷积编码器&#xff1a;由两个卷积层组成&#xff1b;全连接层密集块&#xff1a;由三个全连接层组成。 每个卷积块中的基本单元是一个卷积层、一个sigmoid激活函数和平均汇聚层&#xff1b;每个卷积层使用55卷积核和一个sigmoid激…...

腾讯面经总结

最近在准备面试&#xff0c;看了很多大厂的面经&#xff0c;抽空将腾讯面试的题目整理了一下&#xff0c;希望对大家有所帮助~ 一面 1、mysql索引结构&#xff1f; 2、redis持久化策略&#xff1f; 3、zookeeper节点类型说一下&#xff1b; 4、zookeeper选举机制&#xff…...

matlab机器人工具箱基础使用

资料&#xff1a;https://blog.csdn.net/huangjunsheng123/article/details/110630665 用vscode直接看工具箱api代码比较方便&#xff0c;代码说明很多 一、模型设置 1、基础效果 %采用机器人工具箱进行正逆运动学验证 a[0,-0.3,-0.3,0,0,0];%DH参数 d[0.05,0,0,0.06,0.05,…...

利用WonderLeak进行内存泄露检测【一】

1、下载地址&#xff1a; WonderLeak - Visual Studio Marketplace https://www.relyze.com/ 2、WonderLeak支持vs2017 2019扩展&#xff0c;或者单独启动 3、https://www.relyze.com/docs/wonderleak/help/w/overview/msvc_extension1.png 4、对于二进制程序来说支持以下…...

二刷LeetCode--155. 最小栈(C++版本),思维题

思路:本题需要使用两个栈,一个就是正常栈,执行出入操作,另一个栈只负责将对应的最小值进行保存即可.每次入栈的时候,最小值栈的栈顶也需要入栈元素,不过这个元素是最小值,那么就需要进行比较,因此在getmin()的时候只需要将最小值栈的栈顶元素弹出即可.初始化的时候只需要将最小…...

进程的状态与转换

进程在其生命周期内&#xff0c;由于系统中各进程之间的相互制约及系统的运行环境的变化&#xff0c;使得进程的状态也在不断地发生变化。通常进程有以下5种状态&#xff0c;前三种是基础讷航的基本状态 1&#xff09;运行态。进程正在处理机上运行。在单处理机机中&#xff0…...

用MariaDB创建数据库,SQL练习,MarialDB安装和使用

前言&#xff1a;MariaDB数据库管理系统是MySQL的一个分支&#xff0c;主要由开源社区在维护&#xff0c;采用GPL授权许可 MariaDB的目的是完全兼容MySQL&#xff0c;包括API和命令行&#xff0c;使之能轻松成为MySQL的代替品。在存储引擎方面&#xff0c;使用XtraDB来代替MySQ…...

【Docker】 使用Docker-Compose 搭建基于 WordPress 的博客网站

引 本文将使用流行的博客搭建工具 WordPress 搭建一个私人博客站点。部署过程中使用到了 Docker 、MySQL 。站点搭建完成后经行了发布文章的体验。 WordPress WordPress 是一个广泛使用的开源内容管理系统&#xff08;CMS&#xff09;&#xff0c;用于构建和管理网站、博客和…...

Hlang社区-前端社区宣传首页实现

文章目录 前言页面结构固定钉头部轮播JS特效完整代码总结前言 这里的话,博主其实也是今年参与考研的大军之一,所以的话,是抽空去完成这个项目的,当然这个项目的肯定是可以在较短的时间内完成的。 那么废话不多说,昨天也是干到1点多,把这个首页写出来了。先看看看效果吧:…...

【LeetCode-Medium】833. 字符串中的查找与替换

题目链接 833. 字符串中的查找与替换 标签 字符串 步骤 Step1. 初始化 ans[]&#xff1a; for (int i 0; i < s.length(); i) { // 初始化ansans[i] s[i]; }Step2. 根据 index, source, target 查找&#xff1b;如果找到&#xff0c;那么将 ans[i] 更改为 target&am…...

数据结构中公式前中后缀表达式-二叉树应用

目录 数据结构中公式前中后缀表达式-二叉树应用 数据结构中公式前中后缀表达式-二叉树应用 什么是前缀表达式、中缀表达式、后缀表达式 前缀表达式、中缀表达式、后缀表达式&#xff0c;是通过树来存储和计算表达式的三种不同方式 以如下公式为例 通过树来存储该公式&#x…...

Visual Studio 2022连接远程系统进行C/C++开发

Visual Studio被称为是宇宙最强IDE&#xff0c;以前开发Linux C/C服务器程序&#xff0c;基本上都是在Windows上使用VS编写跨平台的C/C代码&#xff0c;然后先在VS中编译、链接、调试&#xff0c;然后在Linux下编译、链接&#xff0c;再针对Linux下的特定代码进行调试。后面Vis…...

TiDB数据库从入门到精通系列之二:TiDB数据库的简介

TiDB数据库从入门到精通系列之二&#xff1a;TiDB数据库的简介 一、TiDB数据库的简介二、五大核心特性三、四大核心应用场景四、TiDB数据库与MySQL数据库的兼容性 一、TiDB数据库的简介 TiDB是开源分布式关系型数据库&#xff0c;是一款同时支持在线事务处理与在线分析处理 (H…...

opencv视频截取每一帧并保存为图片python代码CV2实现练习

当涉及到视频处理时&#xff0c;Python中的OpenCV库提供了强大的功能&#xff0c;可以方便地从视频中截取每一帧并将其保存为图片。这是一个很有趣的练习&#xff0c;可以让你更深入地了解图像处理和多媒体操作。 使用OpenCV库&#xff0c;你可以轻松地读取视频文件&#xff0…...

ssc377d修改flash分区大小

1、flash的分区默认分配16M、 / # df -h Filesystem Size Used Available Use% Mounted on /dev/root 1.9M 1.9M 0 100% / /dev/mtdblock4 3.0M...

《从零掌握MIPI CSI-2: 协议精解与FPGA摄像头开发实战》-- CSI-2 协议详细解析 (一)

CSI-2 协议详细解析 (一&#xff09; 1. CSI-2层定义&#xff08;CSI-2 Layer Definitions&#xff09; 分层结构 &#xff1a;CSI-2协议分为6层&#xff1a; 物理层&#xff08;PHY Layer&#xff09; &#xff1a; 定义电气特性、时钟机制和传输介质&#xff08;导线&#…...

Python爬虫实战:研究feedparser库相关技术

1. 引言 1.1 研究背景与意义 在当今信息爆炸的时代,互联网上存在着海量的信息资源。RSS(Really Simple Syndication)作为一种标准化的信息聚合技术,被广泛用于网站内容的发布和订阅。通过 RSS,用户可以方便地获取网站更新的内容,而无需频繁访问各个网站。 然而,互联网…...

【单片机期末】单片机系统设计

主要内容&#xff1a;系统状态机&#xff0c;系统时基&#xff0c;系统需求分析&#xff0c;系统构建&#xff0c;系统状态流图 一、题目要求 二、绘制系统状态流图 题目&#xff1a;根据上述描述绘制系统状态流图&#xff0c;注明状态转移条件及方向。 三、利用定时器产生时…...

大数据学习(132)-HIve数据分析

​​​​&#x1f34b;&#x1f34b;大数据学习&#x1f34b;&#x1f34b; &#x1f525;系列专栏&#xff1a; &#x1f451;哲学语录: 用力所能及&#xff0c;改变世界。 &#x1f496;如果觉得博主的文章还不错的话&#xff0c;请点赞&#x1f44d;收藏⭐️留言&#x1f4…...

华为OD机考-机房布局

import java.util.*;public class DemoTest5 {public static void main(String[] args) {Scanner in new Scanner(System.in);// 注意 hasNext 和 hasNextLine 的区别while (in.hasNextLine()) { // 注意 while 处理多个 caseSystem.out.println(solve(in.nextLine()));}}priv…...

并发编程 - go版

1.并发编程基础概念 进程和线程 A. 进程是程序在操作系统中的一次执行过程&#xff0c;系统进行资源分配和调度的一个独立单位。B. 线程是进程的一个执行实体,是CPU调度和分派的基本单位,它是比进程更小的能独立运行的基本单位。C.一个进程可以创建和撤销多个线程;同一个进程中…...

MySQL:分区的基本使用

目录 一、什么是分区二、有什么作用三、分类四、创建分区五、删除分区 一、什么是分区 MySQL 分区&#xff08;Partitioning&#xff09;是一种将单张表的数据逻辑上拆分成多个物理部分的技术。这些物理部分&#xff08;分区&#xff09;可以独立存储、管理和优化&#xff0c;…...

规则与人性的天平——由高考迟到事件引发的思考

当那位身着校服的考生在考场关闭1分钟后狂奔而至&#xff0c;他涨红的脸上写满绝望。铁门内秒针划过的弧度&#xff0c;成为改变人生的残酷抛物线。家长声嘶力竭的哀求与考务人员机械的"这是规定"&#xff0c;构成当代中国教育最尖锐的隐喻。 一、刚性规则的必要性 …...

【iOS】 Block再学习

iOS Block再学习 文章目录 iOS Block再学习前言Block的三种类型__ NSGlobalBlock____ NSMallocBlock____ NSStackBlock__小结 Block底层分析Block的结构捕获自由变量捕获全局(静态)变量捕获静态变量__block修饰符forwarding指针 Block的copy时机block作为函数返回值将block赋给…...