The full text 3283 words, when learning is expected to grow 10 Fenzhong
Figure source: Unsplash
This time, as we arrange on a small core of 11 top VueJS developer tools.
Vue JS recently more and more popular, mainly because it provides convenience for people to learn and develop applications. Both experienced and novice developers still want to use Vue, the right tools are necessary. This will help to quickly create stunning applications without having to do repetitive work.
When selecting a list of tools for this article, consider a small core Vue JS entire development cycle. From the beginning to set the template file a new application covering a number of important applications of the concept of the program, debug, and even test.
Well worth a look, did not talk much, we make haste to start ~
Figure source: Unsplash
1. Axios
Axios is a popular third-party libraries for creating and managing ajax request. After Vue once the "official" ajax library "vue resources" separate from its repository, the team of choice for Vue is Axios. This increases the popularity of Axios, the number of users has also increased.
This behavior is a very good reason, although not part of Axios Vue official repository, but it is very similar to his predecessor, but also has the versatility to support cancel function, with TypeScript definition. One benefit of using Axios is that if the server does not support the commitment itself, users need to provide their own sub-script.
2. Vue Apollo
GraphQL is a versatile tool for the use of the API. It allows querying the appropriate data required for an application or function. A GraphQL VueApollo is most convenient method for the Vue.
Apollo's components help in true declarative way to use GraphQL. Apollo core to provide for the back-end application schema language, a query language to provide a front-end applications to facilitate data exchange. It also supports server-side rendering, thus rendering HTML can be implemented on the server side.
3. Vuex
Configuration management is a major issue for many developers are trying to solve. No reasonable means of state control applications unpredictable. Vuex provides a solution to this problem, which brings together all of the state management function, allowing only state in a predictable manner changed.
Vuex允许基于状态、视图和动作进行变化。状态明确有关应用程序的真实情况；视图将真实情况展现给用户，动作引起状态的改变，重启变化周期。
Vue路由器也提供诸如零配置时程分析调试以及状态快照导出或导入的功能。
4. Mocha
测试是应用程序的一个重要方面。它确保应用程序满足客户的期待，应用程序的开发方式得当。这对于Vue或JavaScript框架构建的应用程序来说甚至更加重要。
虽然有很多框架可达成此目的，但笔者选择了Mocha，原因是它可以通过Node.JS在后端运行，也可以在前端运行。在验证过程的两端时，这使得异步测试既方便又有意义。将未捕获异常映射到GitHub相关测试用例的能力让追踪和解决这些异常变得更加方便。
5. Nuxt JS
VueJS设置完成后，创建应用程序的第一步是设置一个好的样板文件。这将有助于避免从头开始编写代码。创建样板文件有多种选择，但本列表选择了Next JS，因为它允许创建多种类型的应用程序，比如服务器端渲染(SSR)、渐进式网络应用程序(PWA)、单页面应用程序(SPA) 以及静态网站。
Nuxt具有模块架构，它由50多个模块组成，可加快开发进程。这些模块支持某些任务，比如获得渐进式网络应用程序、添加谷歌分析或生成站点地图。
它还通过捆绑分析器实现Vue JS和Node.JS的最佳实践，从而提供了即时可用的性能调整。
6. Vue.js官方指南
如果人们对Vue以及它所有的出色工具感兴趣，那么Vue JS官方指南就是了解更多信息的最好选择。
该指南适用于Vue所有当前和历史版本，因此无论是初学者，还是想要改进或扩展基于旧版本的现有应用程序的用户，都可以从中学到很多。通过版本历史比较组件的变化也可以轻松实现。
此外，视频、代码段、交互式应用程序也增强了该指南的交互性，使其更易于理解。指南的最后一部分将其他框架进行了比较（比如React和Angular），十分有用。这将吸引那些熟悉此类框架的开发人员去适应Vue。
7. Bit for Vue
示例: 在bit.dev上共享的Vue组件
Bit是一种构建下一代Vue组件库的好方法。它解决了跨存储库共享并协调用户界面组件的问题。它也是一种将用户界面与共享组件（独立进行开发、版本控制以及更新）组合在一起的有效办法。
开发人员可以在bit.dev平台上托管并组织组件。如果说组件库像CD音乐专辑的话，那么Bit.dev就像iTunes。Bit.dev利用Bit的CLI工具进行版本控制，并将独立组件从本地项目中推送到Bit.dev的收藏夹中，独立组件在那里进行组织、记录、渲染，还可以进行安装或导入。
它也可以和React等一起使用
开发人员团队可以在Bit.dev上搜索、渲染、安装，甚至是更新来自新项目的组件。平台的自动组件文档、渲染沙盒等功能都是现成可用的。
Bit在追踪各个组件的依赖性并将其版本控制为独立的代码单元方面发挥了神奇的作用。它还可以在隔离环境中构建和测试共享组件，确保它们真正可重用，之后将它们从本地项目中导出到bit.dev的收藏夹中。
8. 用于浏览器的Vue.js DevTools
调试对有效的开发过程来说至关重要。没有好的调试工具，想要了解应用程序的运行情况几乎不可能。除了Vue JS推荐的官方调试工具，笔者还有什么更好的选择吗？
它具有适用于Firefox浏览器和Chrome浏览器的插件，以及适用于任何环境的独立电子应用程序。浏览器插件将“Vue”选项卡添加到本机开发人员工具中，从而让调试体验更加流畅、易于操作。
9. Vue CLI
正如JavaScript的其他框架一样，没有CLI工具便不能在Vue上做很多事情。CLI允许快速创建项目结构以及部署样板文件。它还允许创建即时原型，从而展示新功能。
除了常见的附属项目，Vue CLI还会对网络开发工具提供更多支持，比如TypeScript、Babel、PostCSS、ESLint、单元测试、PWA以及端到端测试。它还与社群创建可扩展的第三方插件兼容。
Vue CLI的另一个好处是它不需要弹出。换句话说，与其他框架相比，可以用Vue CLI做更多定制工作。Vue CLI的图形用户界面是最重要的一项功能，它允许创建新项目，管理起来也很方便。
10. Vuetify
顾名思义，Vuetify是“Vue”和“Beautify（美化）”两个词的组合，这正是Vuetify的功能。它是一个精美的手工制作用户界面组件库，无论用户是否是设计师，它都有助于创建精美的应用程序，。
Vuetify基于材料设计规范提供了80多个组件，该设计规范具有Vue CLI插件，提供了现成的项目脚手架。其中还内置了服务器端渲染支持。这些组件包括警报、横幅、徽章、按钮、表单输入和控件、进度部件等等。
11. Vue路由器
对于熟悉其他JavaScript框架的人来说，路由应该不是什么新概念。路由器用于将URL应用程序映射到组件。在这一点上，Vue路由器做的很不错，而且它支持基于组件的路由器配置。
此外，为允许进行复杂路由，Vue路由器还支持路由器参数、查询和通配符。和其他框架相比，过渡效果等功能让变化的路由更具吸引力，带有活跃计算机系统模拟(CSS)的链接让Vue路由器提供了更多服务。
Vue路由器还可以让用户在HTML5历史记录和hash模式之间进行选择。这一点至关重要，因为它会影响用户体验，尤其当应用程序要求用户导航到上一页时。
图源：Unsplash
无论是初学者还是经验丰富的开发人员，这些工具都可以让开发过程更有效率。
不信就来试试吧，实践出真知~
留言 点赞 关注
我们一起分享AI学习与发展的干货
欢迎关注全平台AI垂类自媒体 “读芯术”
（添加小编微信：dxsxbb，加入读者圈，一起讨论最新鲜的人工智能科技哦～）
