7 practical Vue3 development tools worth collecting (share)

Compared with other large frameworks, Vue is more flexible. Developers can choose to use Vue to develop a new project or introduce Vue into an existing project. The code is concise and easy to use, so it is favored by developers. The following article will summarize and share with you 7 commonly used Vue development tools. Please add them to your favorites!

1. unplugin-vue-components

antfu automatically imports on-demand components and supports Vue 2 and Vue 3 out of the box, Tree -shakable, only registers the components you use, with built-in parsers for popular UI libraries. (Learning video sharing: vuejs tutorial)

Download address: https://www.npmjs.com/package/unplugin-vue-components

The unplugin-vue-components plug-in can automatically introduce components into Vue files (including the project's own components and components in various component libraries); the author is Anthony Fu, a well-known person in the Vite ecosystem.

After using this plug-in, there is no need to manually write code like import { Button } from 'ant-design-vue'. The plug-in will automatically recognize the custom code used in the template. Define components and automatically register them.

2. vuex-persistedstate

vuex can perform global state management, but the data will disappear after refreshing. This That's what we don't want to see. How to solve it? We can combine local storage to achieve data persistence, or we can use the persistence plug-in: vuex-persistedstate.

It can persist and reload your Vuex state between page reloads

github address: https://github.com/robinvdvleuten/vuex-persistedstate

3. vuex-persist

supports Typescript Vuex plug-in, which can save the application state to In persistent storage, such as Cookies or localStorage

Official address: https://championswimmer.in/vuex-persist/

4. @vueuse/gesture

##Gesture library to make applications interactive

Official address: https://gesture.vueuse.org/

5, unplugin-auto-import

antfu automatically imports Vite, Webpack, Rollup and esbuild API. TypeScript is supported.

github address: https://github.com/antfu/unplugin-auto-import

##6、pinia-plugin -persistedstate (Pinia data persistence storage)
Configurable persistence of Pinia store

github address: https://github.com/prazdevs/ pinia-plugin-persistedstate

7、Vue TermUIA terminal UI based on Vue.js Framework that allows you to easily build modern terminal applications

Official address: https://vue-termui.dev/

(Learning video sharing:

Web front-end development

, Introduction to programming)

The above is the detailed content of 7 practical Vue3 development tools worth collecting (share). For more information, please follow other related articles on the PHP Chinese website!