vue3.0开源项目，用vue开发好看的官网

头条共创 2024-07-05

2b9db2eeaa394ada9660f84c125dca35~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1720791224&x-signature=tPKgQc9XKdZLmd%2BBlii2JC06E%2BM%3D 无论您是新开发人员还是经验丰富的老手，我们都喜欢开源软件包。作为开发者，很难想象如果没有这些开源软件包我们的生活会是多么的疲惫，靠咖啡生活会是多么的例行公事。幸运的是，随着Vue.js 和Nuxt.js 社区的不断发展，每天都会出现一些优秀的软件包。

下面我们推荐一些很棒的Vue 和Nuxt 包。

Vue.js

Vue.js 是一个非常易于使用的渐进式JavaScript 框架，用于构建用户界面。

1.Vue Dark Mode

Vue.js 的简约深色设计系统。它提供了构建Insomniac 最喜欢的深色界面的基本组件。

地址：https://github.com/LeCoupa/vuedarkmode

2.Vetur

用于VS Code 的Vue 工具。如果您是Vue.js 高级用户，请尝试一下。

地址：https://github.com/vuejs/vetur

3.Vue VS Code Snippets

这些片段很棒。自从我开始学习Vue.js 以来我就一直在使用这个。

地址：https://github.com/sdras/vue-vscode-snippets

4.Bootstrap-Vue

提供最全面的Bootstrap V4 实现。

地址：https://bootstrap-vue.js.org/

5.Vue Native

您是React Native 的粉丝吗？与React Native 类似，Vue Native 框架允许您使用JavaScript 构建跨平台本机移动应用程序。

地址：https://vue-native.io/

6.NativeScript Vue

如果您更喜欢NativeScript，此软件包可帮助您使用NativeScript 和Vue.js 构建本机移动应用程序。

地址：https://github.com/nativescript-vue/nativescript-vue

7.Vue Content Placeholders

这些可组合组件允许您在检索真实内容的同时渲染假渐进式内容。

地址：https://github.com/michalsnik/vue-content-placeholders

8.Vue Autosuggest

一个很棒的Vue.js 自动提示组件。

地址：https://github.com/Educents/vue-autosuggest

9.Vue Clipboard

一个简单的Vue.js 包，允许用户基于Clipboard.js 将文本复制到剪贴板。

地址：https://vue-clipboard2.inndy.tw/

10.Vue Clickaway

可重用的单击指令，用于检测并响应元素外部的单击。当您需要关闭模式窗口或隐藏下拉列表时非常有用。

地址：https://github.com/simplesmiler/vue-clickaway

11.Vue Waypoint

Vue.js 中的v-waypoint 指令用于触发滚动函数。如果您想在滚动时触发动画，这很有用。

地址：https://github.com/scaccogatto/vue-waypoint

12.Vue Virtual Scroller

Vue.js 应用程序的快速无限滚动。

地址：https://github.com/Akryom/vue-virtual-scroller

13.Vue Slideout

Slideout.js 的Vue.js 实现。

地址：https://github.com/vouill/vue-slideout

14.Vue Swing

这是Swing 的vue.js 包装器，具有类似卡片的界面（向左滑动对应“是”，向右滑动对应“否”）。

地址：https://github.com/goweiwen/vue-swing

15.Vue Quill Editor

Vue.js 的Quill 编辑器，支持SPA 和SSR。

地址：https://github.com/surmon-china/vue-quill-editor

16.Vue Stripe Checkout

用于Stripe 结账的Vue.js 插件。

地址：https://github.com/jofftiquez/vue-stripe-checkout

17.Vue Cleave Component

Cleave.js Vue.js 组件，用于在您键入时格式化输入内容（信用卡格式、日期等）。

地址：https://github.com/ankurk91/vue-cleave-component

18.Vuelidate

基于模型的验证使表单验证的实施变得更加容易。

地址：https://github.com/monterail/vuelidate

19.Vue.js Datepicker

一个简单的Vue.js 日期选择器组件。

地址：https://github.com/charliekassel/vuejs-datepicker

20.Vue Moment

想要在Vue.js 应用程序中使用Moment.js？您需要这个包。

地址：https://github.com/brockpetrie/vue-moment

21.Vue Numeric

用于显示格式化货币值的Vue.js 输入字段组件。

地址：https://github.com/kevinongko/vue-numeric

22.Vue Slider Component

这里所有10 个滑块组件都是使用Vue.js 开发的。

地址：https://nightcatsama.github.io/vue-slider-component/example

23.Vue.Draggable

Vue.js组件，基于Sortable.js同步拖拽排序。

地址：https://github.com/SortableJS/Vue.Draggable

24.Vue Draggable Resizable

Vue.js 组件，用于调整大小和可拖动元素，无需外部依赖项。

地址：https://github.com/mauricius/vue-draggable-ressized

25.Vue Color

适用于Sketch、Photoshop 和Chrome 的Vue.js 颜色选择器。

地址：https://github.com/xiaokaike/vue-color

26.Emoji Mart Vue

来自React 的emoji-mart 分支的Vue.js Slack 风格的可定制表情符号选择器组件。

地址：https://github.com/jm-david/emoji-mart-vue

27.Vue YouTube Embed

基于Angular YouTube Embed，可以使用YouTube iframe API。

地址：https://github.com/kaorun343/vue-youtube-embed

28.Vuetable-2

Vue.js 中的数据表组件。

地址：https://www.vuetable.com/

29.Vue Chartist

基于Chartist.js 的响应式图表。

地址：https://github.com/Yopadd/vue-chartist

30.Vue Trend

最优雅的趋势图表组件。

地址：https://github.com/QingWei-Li/vue-trend

31.Epic Spinners

20 个易于使用的CSS 修饰符。

地址：https://github.com/epicmaxco/epic-spinners

32.Vue Notification

在Vue.js 应用程序中使用的成功、警告和错误通知。您可以将其放置在您喜欢的任何位置：右、左、下、上、中。

地址：http://vue-notification.yev.io/

33.Vue Popper

基于Popper.js 的Vue.js 弹出窗口组件。

地址：https://robinck.github.io/vue-popper/

34.Vue Countup

基于CountUp.js，可用于创建显示数值数据的动画。

地址：https://github.com/xlsdg/vue-countup-v2

35.Vue No SSR

用于包装不支持SSR 的组件。

地址：https://github.com/egoist/vue-no-ssr

Nuxt.js

Nuxt.js 是一个基于Vue.js 构建的框架，可以轻松构建服务器端渲染应用程序。

1.创建一个Nuxt应用程序

在几秒钟内创建Nuxt.js 项目的最简单方法。

地址：https://github.com/nuxt/create-nuxt-app

2.Nuxt SAAS资源加载器

让SASS 资源加载为您完成工作，而不是每次创建新文件时手动导入所有SASS 样式。

地址：https://github.com/anteriovieira/nuxt-sass-resources-loader

3.Vue深色模式

该库也是使用Nuxt.js 开发的。