上一篇：vuejs介绍 下一篇：没有了

与Vue.js相关的精彩开发案例 vuejs开发例子、上线


真棒
 

Vue.js 开发事例，上线的产品汇总 

与Vue.js相关的精彩事物列表

  1. 资源
    1. 官方资源
    2. 外部资源
    3. 就业门户
    4. 社区
    5. 播客
    6. 官方例子
    7. 教程
    8. 例子
    9. 图书
  2. 使用Vue.js的项目
    1. 开源
    2. 商业产品
    3. 应用程式/网站
    4. 互动体验
    5. 企业使用
  3. 组件和库
    1. UI组件
      1. 表
      2. 通知
      3. 装载机
        1. 进度条
      4. 工具提示
      5. 覆盖
      6. 视差
      7. 图标
      8. 菜单
      9. 旋转木马
      10. 图表
      11. 时间
      12. 日历
      13. 地图
      14. 音频视频
      15. 无限滚动
      16. 拉扯刷新
      17. 降价
      18. PDF
      19. 树
      20. 社会分享
      21. 二维码
      22. 杂
      23. 形成
        1. 日期选择器
        2. 选择
        3. 滑块
        4. 拖放
        5. 自动完成
        6. 类型选择
        7. 选色器
        8. switch
        9. 屏蔽输入
        10. 富文本编辑
        11. 图像操纵
        12. 上传文件
        13. 上下文菜单
        14. 杂
    2. UI布局
    3. 构架
      1. 响应
      2. 移动
      3. 组件集合
      4. 其他
    4. UI工具
      1. 事件处理
      2. 响应式设计
      3. 形成
        1. 验证
      4. 滚动
      5. 路由
      6. 懒惰负载
      7. 分页
      8. 动画
      9. 元标签
      10. 门户
      11. 过滤器
      12. SVG
      13. 杂
    5. 公用事业
      1. 规格书
      2. HTTP请求
      3. i18n
      4. 自定义事件
      5. 坚持
      6. 国家管理
        1. Redux
        2. Vuex公用事业
      7. 并发管理
      8. 代码风格
      9. CSS
      10. 资产管理
      11. 页面导航
      12. 杂
    6. 集成
    7. 开发工具
      1. 检查
      2. 文件
      3. 测试
      4. 源代码编辑
        1. 原子
        2. 崇高的文本
        3. Vim
        4. 视觉工作室
        5. 括号
        6. Intellij
        7. Emacs
        8. 凯特
    8. 脚手架
      1. 客户
      2. 普遍
      3. 服务器
      4. 电子
      5. 部分
    9. 运行
      1. Commnand Line / Terminal

资源

官方资源

外部资源

就业门户

社区

播客

官方例子

教程

例子

图书

  • Alex Kyriakidis和Kostas Maniatis，Packt的Vue.js 陛下。（2016年11月）
  • 学习Vue.js 2由Olga Filipova，Packt。（2016年12月）
  • 由Alex Kyriakidis和Kostas Maniatis，Leanpub的Vue.js 2的陛下。（2017年3月）

使用Vue.js的项目

开源

  • PageKit - 使用Symfony组件和Vue.js创建的模块化和轻量级的CMS。
  • npmcharts.com - 比较npm软件包和现货下载趋势。
  • KOEL -个人音乐流媒体服务器，它的工作原理。
  • RSS阅读器 - 使用atom电子和vue.js.
  • Gokotta - 由电子和vue创建的简单音乐播放器。
  • CoPilot - 基于AdminLTE的管理门户，具有vue.js集成。
  • 追溯 - 敏捷团队中进行协作回顾的简单工具。
  • 玉器 - 基于mongodb，nodejs，koa，vue等的Cms。
  • astralapp - 轻松组织您的GitHub明星。
  • EME - 优雅的Markdown编辑器。
  • Github-explorer - 一个可以帮助您更好地检查您的github的水疗中心。
  • 酒店 - 从浏览器启动您的开发服务器，并在几秒钟内获取本地域。
  • Surfbird - 使用现代网络技术编写的Twitter客户端。
  • Approach0 - 数学感知搜索引擎。
  • Flox - 自主电影，系列和动漫观看列表。
  • JavaScript猜测游戏 - 用于识别JavaScript工具和库的游戏。
  • vue-ghpages-blog - 基于Vue.js 2 + Webpack 2的GitHub页面的博客。
  • Vuedo - 博客平台，由Laravel和Vue.js.创建。
  • vue-music163 - Vue.js音乐项目。
  • Tomato5 - 实时协作工具，它将番茄工艺与团队状态分享板相结合。
  • 网络学习 - 一种能够简单访问数千种视频教程的Web开发和编程服务。
  • ExcelJSON - 将CSV，TSV转换为/从JSON转换的工具。
  • 物质博客 - 由Laravel5.3和Vue2.x创建的材料博客。
  • VueCompomnentGenerator - 在浏览器上生成vue单个文件组件。
  • SDR新闻 - 从多个来源（Reddit，Hacker News和Prominent Blogs）汇总的网页设计师和开发者的新闻。
  • PJ博客 - 使用Laravel和Vue.js创建的开源博客
  • Lulumi浏览器 - Lulumi浏览器是用Vue.js 2和Electron编码的轻量级浏览器。
  • vue-wordpress-pwa
  • OpenAPI 3查看器 - 浏览并测试使用OpenAPI 3.0规范描述的REST API
  • Stacer - Linux系统优化和监控
  • Distrochooser.de - Linux初学者的导向指南
  • Buka - 电子书管理

商业产品

应用程式/网站

互动体验

企业使用

组件和库

UI组件

表

表/数据网格

通知

烤面包机/小吃店 - 通知用户无模式的临时小弹出窗口

装载机

装载机/旋转器/进度条 - 让用户知道某些东西正在加载

进度条

在页面顶部的一个苗条进度条

工具提示

工具提示/移动

覆盖

覆盖/模态/警报/对话框/灯箱/弹出窗口

  • vuedals - VueJS（2.x）插件，用于具有单个组件实例的多个模态窗口。
  • 甜蜜的模式 - 最好的图书馆发生模态。现在可用于Vue.js.
  • vue-js-modal - 易于使用，高度可定制，移动友好的Vue.js 2.0+模态与0依赖。

视差

  • vue-differences - 滚动比窗口慢的图像，以创建一个整洁的光学效果。
  • vue-parallaxy - Vue.js组件，用于视差图像滚动效果。

图标

  • vue-icons - 基于Webpack的 - 只加载您需要的 - svg内联图标。
  • vue-awesome - Vue.js的Font Awesome组件，使用内联SVG。

菜单

旋转木马

图表

时间

显示时间/日期/年龄

日历

在日历中显示不可编辑的事件

  • vue-fullcalendar - Vue calendar fullCalendar。不需要jQuery。安排事件管理。
  • vue-event-calendar - Vue2的简单事件日历，除Vue2之外没有依赖关系。

地图

音频视频

  • vue-aplayer - 具有控制功能的易于配置的音乐播放器的Vue 2.x组件。
  • vue-audio - 音频标签包装; Vue 2.x的声音播放器组件
  • vue-dplayer - 基于DPlayer的Vue 2.x视频播放器组件。

无限滚动

拉扯刷新

降价

PDF

  • vue-pdf - 基于mozilla的PDF.js的pdf查看器

树

显示树状数据结构

JSON

显示JSON数据

社会分享

  • vue-social-sharing - 用于共享社交网络链接的Vue.js组件，可与Vue.js 1.X或2.X一起使用。

二维码

  • vue-qriously - Vue.js 2组件使用qrious在HTML画布上绘制QR码。
  • vue-qart - vue 2.x for qart.js.的指令。

其他

形成

让用户创建和编辑数据

日期选择器

Date / datetime / time Picker

  • vue-datepicker - 具有Vue.js.的材质设计的日历和datepicker组件。
  • vue2-timepicker - Vue 2.x的下拉时间选择器（小时|分钟|秒），支持灵活的时间格式。
  • vuejs-datepicker - 一个简单的Vue.js datepicker组件。支持禁用日期，内联模式，翻译。
  • Vue-flatpickr - Vicke的平板电脑。

选择

  • vue-select - 一个本地Vue.js组件，它提供与Select2类似的功能，而不需要jQuery的开销。
  • vue-multiselect - Vue.js的通用选择/多重选择/标记组件。

滑块

拖放

  • vuedraggable - Vue组件允许拖放排序与View-Model同步。基于Sortable.js。
  • vue-dragula - 拖放如此简单，它伤害了。
  • vue2-dragula - 一个vue-dragula叉子Vue2，有很多改进。
  • awe-dnd - 与Vue的排序列表指令。

自动完成

自动提示/自动完成/开头

  • vue-instant - Vue即时功能可让您轻松创建自定义搜索控件，并为您的vue 2应用程序提供自动建议。

类型选择

让用户在打字时选择一个标签/东西

选色器

  • vue-color - Vue Color Pickers for Sketch，Photoshop，Chrome＆more。

switch

切换/开/关切换/复选框

屏蔽输入

富文本编辑

图像操纵

编辑图像

上传文件

  • vue-clip - VueJs的简单和可恶的文件上传器。支持Vue> = 2.1。
  • vue-simple-upload - Vue.js的简单文件上传组件
  • vue2-multi-uploader - 拖放使用Vue.js v2和Axios的多个文件上传器组件。上传器显示添加的文件的文件名，大小和总大小。它还允许设置要上传的最少所需文件数。

上下文菜单

其他

  • vue-gmaps - 使用Google Maps API搜索地点和地址。
  • vuep - 使用实时编辑器和预览渲染Vue组件的组件。
  • vue-places - Places组件基于Vue 2.x的places.js。将任何输入转换为地址自动填充。
  • vue-password-strength-meter - 基于vue.js中的zxcvbn的密码强度计
  • vue-float-label - Vue.js的float标签模式。
  • vue-longpress - VueJS（2.x）按钮组件，需要您继续按确认给定的操作。
  • vue-embed - 嵌入组件基于用于Vue 2.x的embed.js，它是嵌入emojis，media，maps，tweets，gists，code，services和markdown的组件。
  • vue-google-autocomplete - Google Maps Places API的Vue.js（2.x）autosuggest组件。
  • vue-ip-input - Vue.js 2.x的ip输入组件

UI布局

整体/主视图的布局

构架

响应

组件+响应布局系统

  • 类星体框架 - 类星体框架。使用VueJs 2创建响应式网站，混合移动应用（Android和iOS版本）以及使用相同代码的Electron应用程序。
  • vue材料 - Vue.js.的材质设计
  • vuetify - Vue.js的材料组件框架2。
  • muse-ui - Vue.js的材料组件库2。
  • buefy - 基于Bulma框架的组件。

移动

用于移动的UI框架

  • framework7-vue - 创建iOS和Android应用程序的全功能HTML框架。
  • vux - [中文]基于WeUI的Vue UI组件。
  • vue-onsenui - 使用HTML5和JavaScript的移动应用开发框架和SDK。创建漂亮而高效的跨平台移动应用。基于Web Components，并为Angular 1，2，React和Vue.js.提供绑定。

组件集合

一套组件无布局系统

  • vue-mdl - Vue.js的可重用材料设计Lite组件
  • keen-ui - 使用Vue编写的基本UI组件的轻量级集合，并受材料设计的启发。
  • vue-admin - Vue Admin Panel Framework，由Vue 2.0和Bulma提供0.3。
  • vuikit - 具有Vue所有功能的UIkit。
  • element-ui - Vue.js 2.0 UI Toolkit for Web。
  • bootstrap-vue - Bootstrap 4 Vue.js的组件2。
  • uiv Bootstrap3由Vue2实现的组件。
  • yuche / vue-strap - Bootstrap 3组件用Vue.js创建1
  • wffranco / vue-strap - Bootstrap 3组件使用Vue.js创建2
移动

一套用于移动的组件

  • mint-ui - Vue.js的移动UI元素

其他

  • nuxt - 服务器渲染的Vue.js应用程序的框架。
  • 应用程序框架 - 具有HTML和JavaScript的IOS和Android应用程序 - 开发，创建和部署 - 免费和开源。

UI工具

事件处理

处理用户事件（滚动，点击，键击，...）

  • vue-shortkey - Vue-ShortKey - Vue.js.插件。
  • vue-throttle-event - 基于requestAnimationFrame的节气门事件。
  • vue-waypoint - Vue的Waypoint组件，这是滚动时触发功能的最简单的方法。
  • vue-clickaway - 可重用的Clickaway指令，用于可重用的Vue.js组件。
  • vue-scrollfire - 在特定滚动位置触发一个事件。
  • vue-resize-directive - Vue指令，用于检测调整大小的事件，具有脱机和调节能力。
  • v-click-outside - Vue指令，对元素之外的点击做出反应，而不会停止事件传播。

响应式设计

  • vue-viewports - 定义您的自定义视口并在组件中使用它们。
  • vue-responsive：Vue.js（2.x）伪指令用于隐藏/显示带有Bootstrap的自定义元素4或3或自定义的断点。

形成

验证

滚动

设置窗口滚动位置

  • vue-chat-scroll - Vue.js 2.0的自动滚动到底部的指令。
  • vue-scrollto - 添加一个监听点击事件和滚动到元素的指令。

虚拟滚动条

  • VBar - Vue.js的虚拟响应式跨浏览器滚动条组件2x。

路由

懒惰负载

分页

动画

  • vue2-animate - Animate.css的Vue.js 2.0端口。用于Vue的内置转换。
  • animated-vue - 一个Ve.js 2.x插件，可以轻松地使用Animate.css动画作为转场。一样简单！

元标签

管理文档头中的元信息

  • vue头 - 管理头标的元信息，一个简单而简单的方法。
  • vue-meta - 在Vue 2.0组件中管理页面元信息。支持SSR +流式传输。

门户

将DOM节点移动到目标DOM节点

过滤器

  • vue2过滤器 - 适用于Vue 2 *的标准过滤器Vue 1. *的集合。

SVG

  • vue-svgicon - 创建svg图标组件的工具。（vue 2.x）。

其他

公用事业

实用程序与UI无关

规格书

HTTP请求

通过HTTP检索数据

i18n

国际化/ L10n /本地化/翻译

自定义事件

坚持

LocalStorage等

  • vue-localstorage - 具有类型支持的Vue.js localStorage插件。
  • vue-ls - Vue插件，用于从Vue上下文中使用LocalStorage。
  • vue-pouch - PouchDB的实时和反应绑定。在IndexedDB中保存数据并与CouchDB进行同步。

国家管理

  • vuex - Vue.js的集中式管理
  • vue-sync - 将Vue状态与浏览器URL，服务器后端和其他端点同步。
  • vuelm - 轻量级的国家管理灵感来自Elm架构。

Redux

  • revue - Vue的Redux绑定。
  • vuedeux - Vue＆Redux的绑定解决方案。

认证/授权

Vuex公用事业

  • vuex-persistedstate - 具有localStorage的Persist Vuex状态。
  • vuex-plugin-jsdata - 用于使用js-data同步Vuex存储的插件。
  • vuex-local - Vuex中的本地状态管理。
  • vuex-action - 用于vuex的实用程序，用于轻松创建和管理操作。
  • vuex-rest-api - 一个Helper实用程序，用于简化使用Vuex的REST API。基于光轴。
  • vuex-cache - 一个Vuex插件实用程序来缓存这些将会进行远程请求的动作。
标签之间同步

并发管理

  • vuency - 适用于Vue.js.的并发管理

代码风格

提高代码的可读性

CSS

  • vue-bem-cn - Vue.JS的简单BEM类名称生成器。

资产管理

建设/编制/捆绑/装载资产的公用事业

  • vue-script2 - 单一页面应用程序的标准化，设计师友好的脚本标记行为。
  • vue-loader - 用于Vue.js组件的Webpack加载程序。
  • vueify - 针对单文件Vue组件进行Browserify转换。
  • vue-compiler - 围绕vue-component-compiler的简单cli包装器。
  • vue-brunch - 添加对Brunch的支持，用于预编译单个文件Vue组件。
  • vbuild - 快速prototype和分发现代网络应用程序，如专业人士。
  • http-vue-loader - 直接从没有node.js环境的html / js加载.vue文件，也不创建步骤。

页面导航

  • vue-navigation - 页面导航库，记录路由和缓存页面，如本机应用程序导航。一个页面导航库，记录路由和缓存页面，像原生APP导航一样。

其他

集成

与服务或其他框架集成

  • vue-disqus - Vue组件，用于在您的应用程序中集成Disqus注释，并支持SPA。
  • vue-youtube-embed - Vue.js和YouTube。
  • vue-add-to-calendar - 提供“添加到日历”功能的Vue.js组件适用于Vue 2.X。
  • Vue + Meteor - Vue在Meteor中的一流融合。
  • vue-apollo - VueJS的Apollo / GraphQL集成。
  • av-ts - 一种现代的，类型安全的，惯用的Vue绑定库。
  • Neutronium - 使用HTML，CSS和JavaScript创建.NET桌面应用程序。
  • vue-threejs - 用于Three.js的Vue绑定。
  • vue-typescript-jest - 用于Vue.js组件的Jest preprocessor.js（支持html，pug和babel）和TypeScript。
  • vue-jest-utils - 使用Jest测试Vue.js组件的实用程序。
  • vue-custom-element - Vue自定义元素 - Vue.js.的自定义元素。
  • vue-socket.io - Vuejs的Socket.io实现。
  • vue-cordova - Cordova的Vue.js插件。
  • vue-websocket - Vue.js的简单websocket（socket.io）插件。
  • vue-wamp - AutobahnJS包装库Vue.js.
  • Express.js的express-vue - Vue渲染引擎。使用res.render（）将.Vue文件用作模板。
  • vue-echo - 将Laravel Echo集成到Vue中，允许轻松注册套接字事件。
  • vue-grecaptcha - Google reCAPTCHA for VueJS 2
谷歌分析

开发工具

检查

检查和调试

  • Vue.js devtools - 用于调试Vue.js应用程序的Chrome devtools扩展。
  • DejaVue - 为Vue.js创建的可视化和调试工具。

文件

创建文档

测试

无需浏览器的需求

加载没有浏览器的Vue组件

  • vuegister - Vuegister（vue-register的缩写）是用于加载Vue.js单个文件组件（或.vue文件）的需要钩子。
  • vue-node - 在节点中加载vue组件。

源代码编辑

文本编辑器插件

原子

崇高的文本

Vim

  • Vim Vue - 语法突出显示Vue.js组件。

Visual Studio代码

视觉工作室

  • VuePack - 包含Vue.js JavaScript库的HTML Intellisense和代码段。

括号

Intellij

  • Vue.js插件 - Intellij平台（WebStorm，RubyMine，Intellij等）的Vue.js功能。
  • Vue.js支持WebStorm，IntelliJ IDEA，PhpStorm，PyCharm＆RubyMine - JetBrains的官方Vue.js支持

Emacs

凯特

  • Kate语法文件 - katepart（kate，kwrite，kdevelop）的语法文件（修改或原始）。

脚手架

脚手架/样板/种子/入门套件/堆叠组合/ Yeoman发电机

  • vue-cli - 用于脚手架Vue.js项目的简单CLI。

客户

仅在浏览器中渲染Vue应用程序

普遍

将Vue应用程序渲染到服务器上的HTML和浏览器中的DOM

  • SPA入门套件 - 一个高度评价的入门套件，用于使用Laravel和Vue.js.创建单页应用程序。
  • SSR锅炉 - Vue.js服务器侧渲染锅炉，无污染Vuex。

服务器

包括后端样板

  • Vuetober - 使用Laravel，Vue.js和October CMS的单页应用程序。
  • Toucan - 用于创建单页应用程序的Boilerplate。服务器是针对SOLID原则设计的多项目.Net Core解决方案。客户端是TypeScript 2，Vuejs 2，Vuex 2。

电子

  • Electron Vue - 一个Electron＆Vue.js快速启动样板，配有vue-cli脚手架，通用Vue插件，电子包装机/电子助推器，单元/ e2e测试，vue-devtools和webpack。
  • VuePack - 使用Vue 2，Vuex，Vue-Router和Webpack 2（甚至Electron）的现代起动器。

部分

脚手架部分的应用程序

  • vue生成器 - 用于Vue组件，视图和存储模块的CLI生成器。

运行

Commnand Line / Terminal

  • blessed-vue - VueJS运行时，让您在Vue Edit中编写命令行界面



CC0

vue2.0
vue-router
vuex

Copyright © 2002-2017 vue5.com 版权所有

Top