ESLiint란 무엇입니까?

인코딩이 잘못되면 오류가 발생하지만 코드의 표현 방법은 매우 많다.
ESLit은 인코딩된 표현을 일관성 있게 표현하는 기능을 제공합니다.

실제로 사용해볼게요.

ReactNative 프로젝트 작성

expo init

설치 방법

개발할 때만 필요하기 때문에 설치할 때save dev를 붙여야 합니다.

npm install --save-dev eslint

ESLight 시작

npx eslint --init

많이 물어봤어요.
가장 강력하게 구속되는 가장 아래를 선택하라.

JavaScript를 선택합니다.

React 를 선택합니다.

TypeScript는 당분간 사용하지 마십시오.

node를 선택합니다.

Usea popular style guide를 선택합니다.

어떤 규칙을 따르느냐는 질문에 에어비앤비를 선택했다.

Json을 선택합니다.

이렇게 하면 필요한 라이브러리를 자동으로 검색하고 yes를 선택합니다.

VScode 준비

VScode에 ESLight 플러그인을 삽입합니다.

사용감을 확인하다

제작된 프로젝트의 앱.js를 보고 아래의 빨간색 파선을 발견했다.

전구 아이콘을 마우스로 호버하면 다음과 같은 댓글이 나온다.
예: Disable reactApp.filename-extension for this line.js → App.jsx로 바꾸세요.욕을 먹다.

또한, 아래와 같다.

import React from "react";

나는 단식이라고 욕을 먹었다.

import React from 'react';

사용자 정의 ESLit

ESLight를 설치한 후eslintrc.json이라는 파일을 생성합니다.
rules에서 다양한 맞춤형 제작이 가능합니다.

{
    "env": {
        "browser": true,
        "es2021": true
    },
    "extends": [
        "plugin:react/recommended",
        "airbnb"
    ],
    "parserOptions": {
        "ecmaFeatures": {
            "jsx": true
        },
        "ecmaVersion": 13,
        "sourceType": "module"
    },
    "plugins": [
        "react"
    ],
    "rules": {
        "no-use-before-define": 0
    }
}

"no-use-before-define": 0

이(가) 추가되었습니다.
이것은 정의하기 전에 참고하라고 경고하지만, 규칙을 무시한다.
App.jsx 봐봐.

import { StatusBar } from 'expo-status-bar';
import React from 'react';
import { StyleSheet, Text, View } from 'react-native';

export default function App() {
  return (
    <View style={styles.container}>
      <Text>Open up App.js to start working on your app!</Text>
      <StatusBar style="auto" />
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});

코드 아래의const가 정의한 스타일은 위의입니다

<View style={styles.container}>

를 참고하십시오.
그러나 JavaScript에서는 정의하기 전에도 문제가 발생하지 않습니다.
ESLight의 "정의하기 전에 호출 중"경고의 규칙을 무시합니다.eslintrc.제이슨이 들어왔습니다.

총결산

ESLit은 개인이든 팀 개발이든 강력한 조력자가 될 수 있도록 조율에 규칙을 설정했다.