首页 > tools > CodeEditor > intelliJ > > 正文

intellij无法识别react语法

发布人:zhoulujun@live.cn    点击:

react在webstorm中无法正确识别处理~~怎么办?如何设置……

今天 用grunt 管理reactjs……

打开项目,一路飘红……

why……

Preferences -> Languages and Frameworks -> JavaScript -> language version下拉框里选JSX Harmony : ) ——在 Languages & Frameworks > JavaScript 条目下开启JSX语法支持。

展开 JavaScript > Libraries ,勾选 ES6 语法支持。

同时最好安装 :


blob.png


我们使用ESlint来检查基本的语法错误,请继续展开 "JavaScript > Libraries > Code Quality Tools > ESLint" 菜单启用 ESLint。 ESLint 规则以 airbnb 为基础,考虑到中国国情以及团队习惯,我们进行了部分细节调整:

{
  "extends": "airbnb",
  "rules": {
    "comma-dangle": [1, "never"], // 不对数组或对象末尾逗号做强制要求
    "spaced-comment": [0, "always"], // 不对注释前的空格做强制要求
    "func-names": 0 // 允许使用匿名函数
  }}

其他完全沿用airbnb,详见 https://github.com/airbnb/javascript

代码风格设置

为了让编辑器产生的代码能够顺利通过ESLint的校验,我们在airbnb开源的基础上定制了自己的代码风格:  在 "Editor > Code Style" 菜单中点击 "Manage..." 按钮;

在弹出来的对话框里选择 "Import..."

点击确定后会出现文件选择对话框,选择本项目根目录下的 .jscsrc 文件

建议命名为KM,以便和其他代码风格区分。 本代码风格总体依然沿用 airbnb,同样对部分细节做了调整:

{
  "preset": "airbnb",
  "excludeFiles": [
    "dist/**", "node_modules/**", "webpack*", "styleguide.js"
  ],
  "requirePaddingNewLinesBeforeLineComments": null, // 不强制注释前空行
  "requireTrailingComma": null, // 不强制要求末尾逗号
  "validateQuoteMarks": null, // 字符串单引号,React 属性双引号
  "validateIndentation": {
    "value": 2,
    "allExcept": [
      "comments" // 忽略注释中的缩进
    ]
  },
  "maximumLineLength": {
    "value": 80, // 单行最长80个字符,注释除外
    "allExcept": [
      "comments", "urlComments", "functionSignature"
    ]
  },
  "requirePaddingNewLinesAfterBlocks": null,// 区块之间不强制空行
  "disallowEmptyBlocks": {
    "allExcept": "comments" // 不把注释当成空处理
  }}

调整后规则的直观体现见 styleguide.html