一些好用的前端小插件(转自知乎)

一些好用的前端小插件(2)

1. cropper.js

Cropper.js 2.0 是一系列用于图像裁剪的 Web 组件。

官网地址:https://fengyuanchen.github.io/cropperjs/v2/zh/

2. Vditor

Vditor是一款浏览器端的 Markdown 编辑器,支持所见即所得、即时渲染(类似 Typora)和分屏预览模式。它使用 TypeScript 实现,支持原生 JavaScript、Vue、React、Angular,提供桌面版。

官网地址:https://b3log.org/vditor/
Github地址:https://github.com/Vanessa219/vditor

3. PPTist

PPTist是一个基于 Vue3.x + TypeScript 的在线演示文稿(幻灯片)应用,还原了大部分 Office PowerPoint 常用功能,支持 文字、图片、形状、线条、图表、表格、视频、音频、公式 几种最常用的元素类型,每一种元素都拥有高度可编辑能力,同时支持丰富的快捷键和右键菜单,支持导出本地 PPTX 文件,支持移动端基础编辑和预览,支持 PWA。您可以在此基础上搭建自己的在线幻灯片应用。

在线体验地址:https://pipipi-pikachu.github.io/PPTist/
github地址:https://github.com/pipipi-pikachu/PPTist

4. Element Tiptap Editor

Element Tiptap Editor 是一个在 web 开发领域“所见即所得”的富文本编辑器,基于 tiptap 编辑器和 element-ui 开发,相比很多富文本编辑器,Element Tiptap Editor 使用易上手,对开发者友好,而且可扩展性强,设计简洁。

操作按钮等组件使用 element-ui 组件,整体样式协调美观
有许多开箱即用的 extension(编辑器扩展)
支持 markdown 语法
支持TypeScript 支持
支持 i18n(en, zh, pl, ru, de, ko, es, zh_tw, fr, pt_br, nl, he)
可用的 events: init, transaction, focus, blur, paste, drop, update
高度自定义, 你可以自定义 extension 和它对应的菜单按钮视图
操作灵活,可以通过直接控制编辑器的行为来定制编辑器。
提供中文文档

地址 https://github.com/Leecason/element-tiptap

5. TypeIt

TypeIt是一个通用的JavaScript打字机效果实现程序。凭借其简单而灵活的配置,您可以键入单个或多个字符串,这些字符串可以中断行,删除/替换彼此,轻松处理包含HTML的字符串,循环等等。而且为了获得更高级、更可控的打字效果,TypeIt附带了一些配套功能,这些功能可以链接起来将您的打字控制在单个字符或毫秒,使您能够键入动态叙述,完全控制速度变化、换行、删除和暂停。

动图

github链接:https://github.com/alexmacarthur/typeit
官网地址:https://www.typeitjs.com/

6. qrcode 二维码

qrcode 是一个用于生成二维码的 JavaScript 库。主要是通过获取 DOM 的标签,再通过 HTML5 Canvas 绘制而成,不依赖任何库。

文档地址:https://www.npmjs.com/package/qrcode

7. jsbarcode

jsbarcode是一个用于生成条形码的js库

文档地址:https://www.npmjs.com/package/jsbarcode

8. Clipboard.js

Clipboard.js是一个用于将文本复制到剪贴板的 JS 库。

官网地址:https://clipboardjs.com/

9. Driver.js

Driver.js是一个可以轻松实现新手指引交互JavaScript 工具库,主要的作用是为刚接触应用的新手用户快速了解产品,帮助用户把注意力聚焦到某项功能,从而快速熟悉我们的开发的产品。

官网地址:https://kamranahmed.info/driver.js/

10. Pinia.js

Pinia.jsVue.js团队成员所开发的,是新一代的Vuex,即Vuex5.x,在Vue3.0 项目的使用中备受推崇。

Pinia.js 定位和特点:

  • 完整的 typescript 的支持;
  • 极其轻量,压缩后的体积只有1.6kb;
  • 去除 mutations,只有 stategettersactions(这是我最喜欢的一个特点);
  • actions 支持同步和异步;
  • 没有模块嵌套,只有 store 的概念,能够构建多个 storestore 之间可以自由使用,更好的代码分割;
  • 关联 Vue Devtools 钩子,提供更好地开发体验;
官网地址:https://pinia.vuejs.org/

11. Vue-CoreVideoPlayer

Vue-CoreVideoPlayer是一款基于 vue.js 的轻量级的视频播放器插件插件。

文档地址:https://core-player.github.io/vue-core-video-player/zh/

原文:一些好用的前端小插件(2) - 知乎 

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

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

相关文章

LeetCode.283移动零(双指针)

LeetCode.283移动零 1.问题描述2.解题思路3.代码 1.问题描述 给定一个数组 nums,编写一个函数将所有 0 移动到数组的末尾,同时保持非零元素的相对顺序。 请注意 ,必须在不复制数组的情况下原地对数组进行操作。 示例 1: 输入: nums [0,1…

北京数字孪生赋能工业制造,加速推进制造业数字化转型

随着新一代信息技术与实体经济深度融合进程的加快,企业数字化转型需求的提升,政策的持续支持,数字孪生将为工业制造、未来生活带来无限的可能。在制造业数字化大变革时代,以5G、大数据、物联网、人工智能等为代表的工业4.0&#x…

Cobalt Strike的各类反向上线操作

声明:本文仅限于技术讨论与分享,严禁用于非法途径。若读者因此作出任何危害网络安全行为后果自负,与本号及原作者无关。 前言 Cobalt Strike 使用 GUI 框架 SWING(一种java GUI的库)开发,攻击者可通过CS木马…

2015年8月19日 Go生态洞察:Go 1.5版本发布

🌷🍁 博主猫头虎(🐅🐾)带您 Go to New World✨🍁 🦄 博客首页——🐅🐾猫头虎的博客🎐 🐳 《面试题大全专栏》 🦕 文章图文…

【matlab程序】南海土台风画法

【matlab程序】南海土台风画法 图片 往期推荐 图片 【python海洋专题一】查看数据nc文件的属性并输出属性到txt文件 【python海洋专题二】读取水深nc文件并水深地形图 【python海洋专题三】图像修饰之画布和坐标轴 【Python海洋专题四】之水深地图图像修饰 【Python海洋专…

IP 代理的基础知识有哪些?

本文将介绍流冠IP代理的基础知识,帮助您了解IP代理的概念、类型、作用、设置方法和注意事项。 一、IP代理的概念 IP代理是一种网络代理服务,它通过代理服务器帮助用户访问互联网,并将用户的请求转发到目标网站,同时将目标网站的响…

眼镜清洗机原理是怎么样的?2023年眼镜清洗机推荐

在日常生活中有许多小伙伴是因为看太多书或者是看太多电子产品导致近视佩戴上了眼镜,毕竟眼镜佩戴上后就再也离不开它了,像日常佩戴的眼镜上会积累非常多污垢以及堆积细菌,而我们手动清洗眼镜时不能除菌也不能清洁到缝隙中,像眼镜…

BUUCTF [WUSTCTF2020]find_me 1

BUUCTF:https://buuoj.cn/challenges 题目描述: 得到的 flag 请包上 flag{} 提交。 感谢 Iven Huang 师傅供题。 比赛平台:https://ctfgame.w-ais.cn/ 密文: 下载附件,得到一个.jpg图片。 解题思路: 1、得到一张图…

[黑马程序员SpringBoot2]——开发实用篇3

目录: jetcache远程缓存方案jetcache本地缓存方案jetcache方法缓存j2cache基本操作springboot整合quartz​​​​​​​springboot整合task发送简单邮件发送多部件邮件消息简介购物订单案例-发送短信ActiveMQ安装springboot整合ActiveMQRabbitMQ安装springboot整合…

发挥云计算潜力:Amazon Lightsail 与 Amazon EC2 的综述

文章作者:Libai 欢迎来到云计算世界,这里有无数的机会和无限的应用程序增长。 在当今的数字时代,企业可能会发现管理基础架构和扩展应用程序具有挑战性。 传统的本地解决方案需要大量的硬件、软件和维护前期投资。 要满足不断增长的需求&…

docker安装以及idea访问docker

其他目录: docker 安装环境(有空更新) url “” docker 打包java包,并运行(有空更新) url “” docker 打包vue (有空更新) url “” docker 多服务 (有空更新&#xff…

用好语言模型:temperature、top-p等核心参数解析

编者按:我们如何才能更好地控制大模型的输出? 本文将介绍几个关键参数,帮助读者更好地理解和运用 temperature、top-p、top-k、frequency penalty 和 presence penalty 等常见参数,以优化语言模型的生成效果。 文章详细解释了这些参数的作用…