草庐IT

前端精美插件

littlesunn 2023-09-28 原文

element-ui,echart 耳熟能详的就不说的,以下推荐使用场景不那么频繁,但用到方恨少的插件!

  1. 数字翻滚动画
    https://github.com/gitWhatever/vue-digitroll

  2. html元素连线,两点连线 带方向, 可以是曲线
    https://github.com/anseki/leader-line

  3. 视差滚动
    https://github.com/Prinzhorn/skrollr
    http://prinzhorn.github.io/skrollr/ // 效果展示

  4. 无缝滚动
    https://github.com/chenxuan0000/vue-seamless-scroll

  5. 图片查看, 功能多
    https://github.com/mirari/v-viewer

  6. 滚动到当前视图执行动画
    https://scrollrevealjs.org/

  7. 前端导出excel
    https://github.com/exceljs/exceljs

  8. 功能强大的表格, 支持虚拟滚动
    https://github.com/x-extends/vxe-table

  9. threejs 3d canvas 教材案例
    https://github.com/josdirksen/learning-threejs-third

  10. gojs 2d canvas 关系图,流程图等...
    https://github.com/NorthwoodsSoftware/GoJS

  11. dayjs 轻量级日期格式化
    https://dayjs.fenxianglu.cn/

  12. 瀑布流
    https://github.com/lfyfly/vue-waterfall-easy

  13. 自定义拖拽布局,功能强大
    https://github.com/jbaysolutions/vue-grid-layout

  14. 本地存储sessionStorage, localStorage封装
    https://www.npmjs.com/package/good-storage

  15. 拖拽排序(表格的每一行或html元素),耦合度低
    https://github.com/SortableJS/Sortable
    https://www.itxst.com/sortablejs/neuinffi.html // 中文文档

  16. 二维码生成
    https://github.com/davidshimjs/qrcodejs

  17. 自定义css动画+调试
    https://github.com/michaelvillar/dynamics.js#usage

  18. 根据鼠标移动元素transform, 类似于视差滚动,但一般用于背景展示
    https://github.com/Aminerman/vue-kinesis

  19. 文字跑马灯
    https://github.com/EvodiaAut/vue-marquee-text-component

  20. 后台springboot 插件: sa-token (调调api就能完成登录权限验证,不用些security那套冗长的代码了)
    https://sa-token.dev33.cn/doc/index.html#/

  21. web端excel编辑器,用canvas绘制(适合复杂表格,简单表格还是用vxe-table比较好)
    https://gitee.com/mengshukeji/Luckysheet

  22. 看他的trending推荐前端精美的有创意作品,也不能说是插件,就是可以提升你的审美
    https://codepen.io/

  23. 弹幕插件
    https://blog.chenhaotaishuaile.com/vue-baberrage/

  24. 甘特图
    https://github.com/neuronetio/vue-gantt-elastic

  25. 手绘风格的图表
    https://github.com/jwilber/roughViz

  26. three封装成vue组件,可通过标签形式创建或引入模型,但是只支持vue3
    https://github.com/troisjs/trois

  27. 地图插件,支持3d,可扩展性高,感觉比leaflet和openlayers强
    https://maptalks.org/examples/cn/map/load/#map_load

  28. d3 svg类型的可视化插件,学这个的同时,正好可以深入一下svg基础
    https://www.d3js.org.cn/document/

  29. openlayers一个地图插件
    https://openlayers.org/en/latest/apidoc/

  30. gasp动画过渡插件,类似于html的过渡效果,但是如果你是做canvas应用,用不了css动画,可以试试这个,相同功能该有一个叫tweenjs,但我觉得有坑
    https://openlayers.org/en/latest/apidoc/

  31. vue3.0+vite+electron 一键启动客户端的vue项目, 还有一个electron-vue是vue2.x的
    https://github.com/electron-vite/electron-vite-vue

30.《HTML5+JavaScript动画基础》前端必看的一本书,可以刷新你对前端的认知

未完待续...

有关前端精美插件的更多相关文章

  1. ruby - 如何每月在 Heroku 运行一次 Scheduler 插件? - 2

    在选择我想要运行操作的频率时,唯一的选项是“每天”、“每小时”和“每10分钟”。谢谢!我想为我的Rails3.1应用程序运行调度程序。 最佳答案 这不是一个优雅的解决方案,但您可以安排它每天运行,并在实际开始工作之前检查日期是否为当月的第一天。 关于ruby-如何每月在Heroku运行一次Scheduler插件?,我们在StackOverflow上找到一个类似的问题: https://stackoverflow.com/questions/8692687/

  2. ruby-on-rails - 无法使用 Rails 3.2 创建插件? - 2

    我对最新版本的Rails有疑问。我创建了一个新应用程序(railsnewMyProject),但我没有脚本/生成,只有脚本/rails,当我输入ruby./script/railsgeneratepluginmy_plugin"Couldnotfindgeneratorplugin.".你知道如何生成插件模板吗?没有这个命令可以创建插件吗?PS:我正在使用Rails3.2.1和ruby​​1.8.7[universal-darwin11.0] 最佳答案 随着Rails3.2.0的发布,插件生成器已经被移除。查看变更日志here.现在

  3. ruby-on-rails - 您希望看到哪些 Rails 插件? - 2

    您认为可以作为插件很好地存在于您的Rails应用程序中必须实现的哪些行为?您过去曾搜索过哪些插件功能但找不到?哪些现有的Rails插件可以改进或扩展,如何改进或扩展? 最佳答案 我希望在管理界面中看到一个引擎插件,它提供了应用程序中所有模型的仪表板摘要,以及可配置的事件图表。 关于ruby-on-rails-您希望看到哪些Rails插件?,我们在StackOverflow上找到一个类似的问题: https://stackoverflow.com/questio

  4. ruby - vagrant 从 github 安装插件 - 2

    我们正在使用Vagrant进行部署,我们最终希望将此集群部署在Rackspace上。vagrant-rackspace插件是一个自然的选择,但它有一些错误,这些错误未包含在最新的0.1.1版本中(notablythatvagrantprovisiondoesn'twork)。我已经在我的personalfork中解决了这个问题通过合并其他人的工作来对存储库进行改造。是否可以从github安装vagrant插件?显而易见的事情没有奏效:[unix]$vagrantplugininstallvagrant-rackspace--plugin-sourcehttps://github.com

  5. IDEA使用LeetCode插件 - 2

    前言我们习惯用idea编写、调试代码,在LeetCode上刷题时,如果能够在IDEA编写代码,并且做好代码管理,是一件事半功倍的事情。对于后续复习题目,做笔记也会非常便利。本文目的在于介绍LeetCodeEditor的使用,以及配置工具类,最终目录结构如下:note:放置笔记src:放置代码leetcode.editor.cn:插件LeetCodeEditor自动生成utils:自定义的工具包,可用于自动化输入测试用例,定义题目需要的类(结构体)out:运行测试时自动生成LeetCodeEditorGitHub:https://github.com/shuzijun/leetcode-edit

  6. regex - Ruby 是否有类似于 Perl 6 语法的插件? - 2

    多年来,Perl一直是我首选的编程语言工具之一。Perl6语法看起来像是一个很棒的语言特性。我想知道是否有人开始为Ruby做这样的事情。 最佳答案 如果您想在Ruby中使用实际的Perl6语法,最好的选择是Cardinal,Parrot上的ruby​​编译器。它目前尚未完成并且非常缓慢,但我非常希望它最终成为一个可行的ruby​​实现。它目前大部分处于非事件状态,等待Parrot中的一些基础架构更改以支持改进的解析速度和其他功能。 关于regex-Ruby是否有类似于Perl6语法的插件

  7. ruby-on-rails - 你为 Rails 推荐哪个状态机插件? - 2

    关闭。这个问题不符合StackOverflowguidelines.它目前不接受答案。要求我们推荐或查找工具、库或最喜欢的场外资源的问题对于StackOverflow来说是偏离主题的,因为它们往往会吸引自以为是的答案和垃圾邮件。相反,describetheproblem以及迄今为止为解决该问题所做的工作。关闭9年前。Improvethisquestion我正在为Rails3/ActiveRecord项目寻找一个相对简单的状态机插件。我做了一些研究并提出了以下插件:转换:https://github.com/qoobaa/transitions从旧的ActiveRecord状态机库中提取

  8. ruby-on-rails - 使用模块扩展带有 "has_many"的插件中的模型 - 2

    我在引擎样式插件中有一些代码,其中包含一些模型。在我的应用程序中,我想扩展其中一个模型。通过在初始值设定项中包含一个模块,我已经设法将实例和类方法添加到相关模型中。但是我似乎无法添加关联、回调等。我收到“找不到方法”错误。/libs/qwerty/core.rbmoduleQwertymoduleCoremoduleExtensionsmoduleUser#InstanceMethodsGoHere#ClassMethodsmoduleClassMethodshas_many:hits,:uniq=>true#nomethodfoundbefore_validation_on_crea

  9. ruby - 用于 CSS3 跨浏览器兼容性的 SASS 插件? - 2

    是否有一个SASS扩展可以采用SASS样式表,找到中性属性(例如border-radius)并为其输出所有特定于供应商的属性(例如-webkit-border-radius等)自动?我真的不想手动创建所有混入,也不想手动编写代码。我确定一定有这样的扩展名,但我找不到它。帮忙? 最佳答案 有一个非常好的gem可以满足您的需求。它叫做Bourbon它不会用特定于供应商的css替换您的css,因为它可以像SASS一样工作。它基本上是一个正确生成跨浏览器css的mixin集合。 关于ruby-用

  10. ruby-on-rails - 在 Rails 应用程序的前端获取实时日志 - 2

    在Rails3.x应用程序中,我正在使用net::ssh并向远程pc运行一些命令。我想向用户的浏览器显示实时日志。比如,如果两个命令在net中运行::ssh执行即echo"Hello",echo"Bye"被传递然后"Hello"应该在执行后立即显示在浏览器中。这是代码我在ruby​​onrails应用程序中使用ssh连接和运行命令Net::SSH.start(@servers['local'],@machine_name,:password=>@machine_pwd,:timeout=>30)do|ssh|ssh.open_channeldo|channel|channel.requ

随机推荐