开发反应用哪些工具

这篇文章将为大家详细讲解有关开发反应用哪些工具,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。

反应可以用的开发工具有:1,铬反应开发工具;2、视觉反应;3,反应引导;4,创建应用程序反应;5、反应Styleguideist等等。

JavaScript每天都在出现大量的框架和工具,而反应是除了上次我们提到的Vue和灰烬之外另一款比较流行的框架。但因为新的工具每天都在不断的出现,开发者在尝试时总会有些不知所措。

因此,当为你的新反应项目选择合适的IDE,合适的可视化工具甚至是合适的样式时,你都会有很多选择,你该怎么选择合适的?这是一件令人犯愁的事儿。

在本文中,我将介绍11个关于反应的开发工具,以帮助你选择以及带你了解如何用它们来使你更充分的使用框架。

<强> 1。反应开发人员工具

我们将从反应开发人员最受欢迎的工具之一的<强>铬反应开发工具开始说起,它是一个Chrome扩展程序,最近它发布了它的v4版。

安装完成后,打开Chrome的开发人员工具你就能看到多出了组件和分析器选项卡,“组件”选项能帮助你查看屏幕上组件列表以及从其他组件派生出的子组件,你能够选择检查甚至编辑组件的状态和属性。使用“分析器”选项卡,你也可以评估应用程序的性能。

这两个选项都可以在Chrome DevTools选项卡上找的到,为了能更好的体验该插件的功能和特性,你可以使用这个在线站点去体验。

<强> 2。反应看

除了上面的扩展外,我们需要提到另一个Chrome扩展程序反应,它可以帮助你在检查反应应用程序时发挥作用。

在安装DevTools后,在你已经在反应开发工具和视觉反应的扩展设置中启用了“允许访问文件URL”选项,你就可以在DevTools种找到一个新的名为“视觉反应”的标签,当你运行本地程序时,你将可以使用视觉反应以可视化树状的形式查看和创建不同的组件,这将让你能够方便的理解它们的连接方式,在你把鼠标悬停在元素上时,就可以看到它们当前的状态和属性。

<强> 3。反应扩展包(VS工作室)

到目前为止,Visual Studio可能是JavaScript开发人员最喜爱的IDE之一。这里说的是之一而不是唯一,因为有很多不错的其他IDE也非常棒,例如崇高,IntelliJ和Vim。

但在这里我们就不再展开了,这所以这里提到了VS,是因为VS背后有着强大的社区,所以让我们看看<强>反应扩展包。

本质上,它是一组为完成与反应相关任务的扩展包,在一般情况下,对在解析和在做一般JS需求时做的很出色,但这个小工具套包将它带入了一个新的高度。在这个包里,你将找的到:

<李>

ReactJS代码片段:它提供了40个反应代码片段,它可以满足你所有通用需求以及34个proptype特定的代码片段。它能避免你浪费大量时间重复劳作,从而提高日常的工作效率。

<李>

ES线头:添加了对命令行工具的支持。它集成到你的IDE中,并帮助你改进语法,设置自己的编码样式,甚至在某些情况下能为你自动修复错误。

<李>

npm:当你需要安装新的插件,重新启动服务器或是运行某些npm特定命令时,你都必须从IDE跳到终端,这可能会令你有一些累,所以这个扩展增加了直接从IDE直接运行npm命令的功能。

<李>

JS ES6片段:这个插件将包含40多个代码片段,这将是你提高开发效率的绝对必要条件。

<李>

搜索node_modules:使用这个扩展,你可以轻松找到模块并在编辑器中将其打开。

<李>

npm智能感知:使用此模块,你可以轻松列出所有已安装的模块,快速搜索它们,并插入正确的代码片段以将其导入代码中。

<李>

路径智能感知:最后,与上一个扩展名内联,在当你不是处理大型项目的唯一一人时,记住所有路径和文件名变得非常困难和麻烦。此扩展名将帮助您自动完成本地导入的路径。

一共是7个扩展,它们分别为项目提供了一些价值,安装这个扩展包,你可以从VS的命令面板使用以下命令(使用CTRL + p打开它)中轻松进行安装:

ext  install  jawandarajbir.react-vscode-extension-pack

开发反应用哪些工具