彩票走势图

IntelliJ IDEA是Java语言开发的集成环境，IntelliJ在业界被公认为优秀的Java开发工具之一，尤其在智能代码助手、代码自动提示、重构、J2EE支持、Ant、JUnit、CVS整合、代码审查、 创新的GUI设计等方面的功能可以说是超常的。

 IntelliJ IDEA现已更新至2019.2版本，新版本改进了java13预览等20余项功能，提高了开发效率，赶快下载体验吧~（点击查看更新详情）

点击下载IntelliJ IDEA最新试用版

• Java开发平台IntelliJ IDEA教程：与React集成（上）

• Java开发平台IntelliJ IDEA教程：与React集成（中）

**仅Ultimate Edition 支持此功能。

整理一个React应用程序

所有针对JavaScript和HTML 的IntelliJ IDEA内置代码检查都可以在JSX代码中使用。IntelliJ IDEA会在变量和函数未使用，缺少结束标记，缺少语句等情况下提醒您：

对于某些检查，IntelliJ IDEA提供了快速修复，例如，建议添加缺少的方法。要查看快速修复弹出窗口，请按Alt+Enter。

要自定义检查清单，请打开 

除了提供内置的代码检查之外，IntelliJ IDEA还与linters集成在一起，例如用于JSX代码的ESLint。 

1. 在内置终端（视图|工具窗口|终端）中，键入npm install --save-dev eslint 和npm install --save-dev eslint-plugin-react。

2. 将ESLint配置文件.eslintrc添加到您的项目。

3. 在“ 设置/首选项”对话框（Ctrl+Alt+S）中，转到“ 语言和框架” | JavaScript | 代码质量工具| ESLint。在打开的ESLint页面上，选择自动ESLint配置。IntelliJ IDEA会自动在项目的node_modules文件夹中找到ESLint ，然后默认使用.eslintrc配置。

您还可以手动配置ESLint以使用自定义ESLint软件包和配置。

.eslintrc结构示例（带有react插件的ESLint 1.x）

• 在ecmaFeatures对象中，添加"jsx" = true。您还可以在此处指定要使用的其他语言功能，例如ES6类，模块等。

• 在plugins对象中，添加react。

• 在该rules对象中，您可以列出 要启用的ESLint内置规则以及可通过react plugin可用的规则。

{
   "parser": "babel-eslint",
  
   "env": {
    
   "browser": true
  
    },
  "ecmaFeatures": {
    
    "jsx": true
  
    },
  "plugins": [
   
     "react"
  ],
  
     "rules": { 
     "semi": 2 
     }
}

重构一个作出反应的应用

除了常见的IntelliJ IDEA重构之外，在React应用程序中，您还可以为React组件运行Rename并使用Extract Component 创建新组件。

重命名组件

在npm工具窗口（“ 视图” |“工具窗口” |“ npm”）中，双击start任务。

WebPack热模块的更换，开发服务器运行时，应用程序就会自动为你改变任何的源文件并保存更新重新加载。

要调试应用程序做出反应

1、双击npm工具窗口中的启动任务 ，以开发模式启动应用程序。

2、等待应用程序被编译并且Webpack开发服务器准备就绪。在http：// localhost：3000 /中打开浏览器 以查看该应用程序。

3、复制运行应用程序的URL地址（默认情况下为http：// localhost：3000 /），以后在创建调试配置时将需要此URL。

5、创建一个新的JavaScript调试配置：选择Run | 编辑配置，单击，然后从列表中选择JavaScript调试。在“ 运行/调试配置：JavaScript调试”对话框中，将保存的URL http：// localhost：3000 /粘贴 到URL字段中。保存配置。

6、通过在配置列表旁边单击，在代码中设置断点并启动调试会话 。

7、当遇到第一个断点时，切换到“ 调试工具”窗口，然后照常进行： 逐步执行程序， 停止并继续执行程序， 在挂起时对其进行检查，浏览调用堆栈和变量，设置监视，评估变量， 查看实际HTML DOM等等。

构建应用程序做出反应

如果在现有的IntelliJ IDEA项目中安装了React，则需要设置构建过程 。

如果您使用create-react-app创建应用程序，则 您的开发环境已经预先配置为使用Webpack和Babel。

测试应用程序做出反应

您可以在使用create-react-app创建的React应用程序中 运行和调试Jest测试。在开始之前，请确保将react-scripts包添加到package.json的 依赖项对象中。 

您可以通过运行/调试配置来运行和调试Jest测试，或者直接在编辑器中或在“ 项目”工具窗口中运行Jest测试。

要创建一个Jest运行/调试配置

1、打开“ 运行/调试配置”对话框（主菜单上的“运行” |“编辑配置 ”），在左侧窗格中单击，然后从列表中选择“ 笑话 ”。将打开“ 运行/调试配置：Jest”对话框。

2、指定要使用的节点解释器以及 应用程序的工作目录。默认情况下，工作目录字段显示项目根文件夹。要更改此预定义设置，请指定所需文件夹的路径，或从列表中选择以前使用的文件夹。

3、在“ Jest包”字段中，指定react-scripts包的路径。

4、在“ Jest选项”字段中，输入--env=jsdom。