Whether you are a novice developer or an experienced veteran, we all like open source software packages. For developers, without these open source software packages, it is difficult to imagine how exhausted our lives will become, and living on coffee will become commonplace. Fortunately, Vue.js and Nuxt.js have a growing community, and some great packages appear every day.
In the following, we will recommend some very useful Vue and Nuxt packages.
Vue.js
Vue.js is a very easy-to-use progressive JavaScript framework for building user interfaces.
1.Dark Mode View
A minimalist dark design system of Vue.js. It provides basic components for building a dark interface that is the favorite of insomniacs.
Address: https://github.com/LeCoupa/vuedarkmode
2.Winter
Vue tool for VS Code. If you are a Vue.js super user, you must give it a try!
Address: https://github.com/vuejs/vetur
3.Vue VS Code Snippets
These snippets are great, I have been using it since I started learning Vue.js.
Address: https://github.com/sdras/vue-vscode-snippets
4.Bootstrap-Vue
Provides the most comprehensive Bootstrap V4 implementation.
Address: https://bootstrap-vue.js.org/
5.Native view
Are you a fan of React Native? Just like React Native, the Vue Native framework allows you to use JavaScript to build cross-platform native mobile applications.
Address: https://vue-native.io/
6.NativeScript Vue
If you prefer NativeScript, this package can help you build native mobile applications using NativeScript and Vue.js.
address:
https://github.com/nativescript-vue/nativescript-vue
7.Vue Content Placeholders
When acquiring real content, these composable components can be used to render fake progressive content.
address:
https://github.com/michalsnik/vue-content-placeholders
8.Autosuggest view
A great Vue.js auto prompt component.
address:
https://github.com/Educents/vue-autosuggest
9.Clipboard view
A simple Vue.js package that allows users to copy text to the clipboard based on clipboard.js (https://clipboardjs.com/).
Address: https://vue-clipboard2.inndy.tw/
10.Vue Clickaway
A reusable click command that detects and responds to click actions outside the element. It is very convenient when we need to close the modal window or hide the drop-down list.
address:
https://github.com/simplesmiler/vue-clickaway
11.Waypoint view
The v-waypoint instruction of Vue.js is used to trigger functions when scrolling. It comes in handy when you want to trigger an animation when scrolling.
Address: https://github.com/scaccogatto/vue-waypoint
12.Virtual Scroller View
Fast and unlimited scrolling for Vue.js applications.
address:
https://github.com/Akryum/vue-virtual-scroller
13.Slideout view
Vue.js implementation of Slideout.js.
Address: https://github.com/vouill/vue-slideout
14.Vue Swing
It is a vue.js wrapper for Swing (https://github.com/gajus/swing), a card interface (swipe-left corresponds to yes, swipe-right corresponds to no).
Address: https://github.com/goweiwen/vue-swing
15.Quill Editor view
Quill editor for Vue.js, supports SPA and SSR.
Address: https://github.com/surmon-china/vue-quill-editor
16.Vue Stripe Checkout
Vue.js plugin for Stripe checkout.
address:
https://github.com/jofftiquez/vue-stripe-checkout
17.Vue Cleave Component
The Vue.js component of Cleave.js, used to format the input content (credit card format, date, etc.) during input.
address:
https://github.com/ankurk91/vue-cleave-component
18.Return
With model-based validation, form validation is now a breeze.
Address: https://github.com/monterail/vuelidate
19.Vue.js Datepicker
A simple Vue.js date picker component.
address:
https://github.com/charliekassel/vuejs-datepicker
20. Moment View
Want to use Moment.js in a Vue.js application? You need this bag.
address:
https://github.com/brockpetrie/vue-moment
21.Numeric view
Vue.js input field component, used to display formatted currency values.
address:
https://github.com/kevinongko/vue-numeric
22.Slider Component view
The 10 slider components are all developed using Vue.js.
address:
https://nightcatsama.github.io/vue-slider-component/example
23.Vue.Draggable
Vue.js component, based on Sortable.js for synchronous drag-and-drop sorting.
address:
https://github.com/SortableJS/Vue.Draggable
24.Vue Draggable Resizable
Vue.js components, used for resizable and draggable elements, without external dependencies.
address:
https://github.com/mauricius/vue-draggable-resizable
25.Vue Color
Vue.js color picker from Sketch, Photoshop, Chrom.
Address: https://github.com/xiaokaike/vue-color
26.Emoji Mart View
A Slack-style customizable emoji selector component for Vue.js, forked from React's emoji-mart.
Address: https://github.com/jm-david/emoji-mart-vue
27.Vue YouTube Embed
Based on Angular YouTube Embed, allows you to use the YouTube iframe API.
address:
https://github.com/kaorun343/vue-youtube-embed
28.Vuetable-2
The data table component of Vue.js.
Address: https://www.vuetable.com/
29.Chartist View
Responsive chart based on Chartist.js.
Address: https://github.com/Yopadd/vue-chartist
30. Trend view
The most elegant trend chart component.
Address: https://github.com/QingWei-Li/vue-trend
31.Epic Spinners
20 easy-to-use css adjusters.
Address: https://github.com/epicmaxco/epic-spinners
32.Notification view
Success, warning and error notifications used in Vue.js applications. It can be placed on the right, left, bottom, top or middle, wherever you want!
Address: http://vue-notification.yev.io/
33. Popper View
A Vue.js pop-up window component based on popper.js.
Address: https://robinck.github.io/vue-popper/
34.Vue Countup
Based on CountUp.js, it can be used to create animations that display digital data.
Address: https://github.com/xlsdg/vue-countup-v2
35.Vue No SSR
Used to package components that are not friendly to SSR.
Address: https://github.com/egoist/vue-no-ssr
Nuxt.js
Nuxt.js is a framework built on Vue.js to help you easily build server-side rendering applications.
1.Create Nuxt App
The easiest way to create a Nuxt.js project in a few seconds.
Address: https://github.com/nuxt/create-nuxt-app
2. Nuxt SAAS resource loader
You don't need to manually import all SASS styles every time you create a new file, but let SASS resource loading take care of these tasks.
address:
https://github.com/anteriovieira/nuxt-sass-resources-loader
3.Dark Mode View
This library is also developed with Nuxt.js.
Address: https://github.com/LeCoupa/vuedarkmode
4. Nuxt's PWA module
The most reliable and stable module for creating progressive web applications.
Address: https://pwa.nuxtjs.org/
5.Dotenv module
Load the .env file into the Nuxt.js application context.
address:
https://github.com/nuxt-community/dotenv-module
6. Senty module of Nuxt.js
Sentry.io is an open source bug tracker that can add Sentry to Nuxt.js applications.
address:
https://github.com/nuxt-community/sentry-module
7. Google Analytics module of Nuxt.js
Integrate your Google Analytics account with the Nuxt project.
address:
https://github.com/nuxt-community/analytics-module