programing

ATOM Editor에서 ESLint for React를 설정하는 방법

linuxpc 2023. 3. 22. 20:48
반응형

ATOM Editor에서 ESLint for React를 설정하는 방법

Atom Editor에서 다음 플러그인을 설치했습니다.

  1. 린터
  2. 린터 에슬린토

JSX 구문을 인식하지 못하는 것 같습니다.

커맨드 라인에서는 동작하고 있습니다만, 다음과 같은 다른 플러그 인을 사용할 필요가 있습니다.esprima-fb그리고.eslint-plugin-reactAtom Editor용 플러그인은 없는 것 같습니다만, 이 문제를 해결하는 방법을 알고 계신 분이 계십니까?

Eslint가 React.js와 잘 협력할 수 있도록 하려면:

  1. 린터 및 린터 에슬린트 플러그인 설치
  2. 달려.npm install eslint-plugin-react
  3. 더하다"plugins": ["react"].eslintrc 컨피규레이션파일로 이동합니다.
  4. 더하다"ecmaFeatures": {"jsx": true}.eslintrc 컨피규레이션파일로 이동합니다.

예를 들어 다음과 같습니다..eslintrc설정 파일:

{
    "env": {
        "browser": true,
        "node": true
    },

    "globals": {
        "React": true
    },

    "ecmaFeatures": {
        "jsx": true
    },

    "plugins": [
        "react"
    ]
}

현재 Eslint v1.1.0을 사용하고 있습니다.

사이드 노트:프로젝트 의존관계로서 eslint와 eslint-plugin-react를 모두 설치해야 했습니다(예:npm install eslint eslint-plugin-react --save-dev도움이 되었으면 합니다.

2016년 답변 업데이트: ATOM에 패키지를 설치하고.eslintrc파일을 프로젝트 루트(또는 홈 디르)에 저장합니다.

{
  "parserOptions": {
    "ecmaFeatures": {
      "jsx": true
    }
  },
  "env": {
    "es6": true
  }
}

그리고 JSX가 포함된 파일을 다시 열면 작동합니다.

ESLint에서 픽업할 프로젝트 로컬 파일을 편집해야 합니다.ATOM과의 통합을 원하는 경우 플러그인 린터린터-eslint를 설치할 수 있습니다.

ESLint for React 베스트 프랙티스를 신속하게 셋업하기 위해 현재의 베스트옵션은 npm 패키지를 설치하고 확장하여recommended많은 규칙을 수동으로 전환하는 대신 다음과 같이 설정할 수 있습니다.

{
  "extends": [ "eslint:recommended", "plugin:react/recommended" ],
  "plugins": [ "react" ]
}

이 조작에 의해,eslint-plugin-reactESLint & React 사전 설정 규칙 및 권장 규칙.최신 ESLint 사용자 가이드 자체에는 더 중요한 정보가 있습니다.

다음으로 ES6 및 Web Pack용으로 최적화된 파서옵션의 예를 나타냅니다.

{
  "parserOptions": {
    "sourceType": "module",
    "ecmaVersion": 6,
    "ecmaFeatures": {
      "impliedStrict": true,
      "experimentalObjectRestSpread": true,
      "jsx": true
    }
  }
}

Atom을 사용했는데 잘 작동합니다.넌 그냥....eslintrcESLint가 사용하고 있음을 알려주는 프로젝트 루트eslint-plugin-react.

  1. Mac 사용자: Atom --> 기본 설정 --> 설치 --> 검색 패키지 linter-eslint --> 설치를 클릭합니다.

  2. Ubuntu 사용자의 경우: [편집] --> [설정] --> [설치] --> 검색 패키지 linter - eslint --> [설치]을 클릭합니다.

  3. 명령줄 ---> npm install --save-dev eslint-config-coding으로 이동합니다.

  4. atom으로 이동하여 새 파일 .eslintrc를 만들고 랠리 코드를 확장합니다.

언급URL : https://stackoverflow.com/questions/30294870/how-to-config-eslint-for-react-on-atom-editor

반응형