Skip to content
← Back to rules

react/jsx-filename-extension 제한

An auto-fix is available for this rule.

동작 방식

.jsx 파일 확장자 사용을 일관되게 유지하도록 강제합니다.

왜 문제가 되나요?

일부 번들러나 파서는 파일이 JSX를 포함하고 있음을 인식하기 위해 파일 확장자를 기준으로 판단해야 합니다. 이를 통해 파일을 올바르게 처리할 수 있습니다.

예시

이 규칙에 위배되는 잘못된 코드 예시:

jsx
// 파일 이름: MyComponent.js
function MyComponent() {
  return <div />;
}

이 규칙에 맞는 올바른 코드 예시:

jsx
// 파일 이름: MyComponent.jsx
function MyComponent() {
  return <div />;
}

구성

이 규칙은 다음 속성을 가진 구성 객체를 받습니다.

allow

type: "always" | "as-needed"

기본값: "always"

JSX 파일 확장자를 허용하는 시점입니다. 기본적으로 모든 파일이 JSX 확장자를 가질 수 있습니다. as-needed로 설정하면, 실제로 JSX 구문이 포함된 파일에서만 JSX 파일 확장자를 허용합니다.

extensions

type: string[]

기본값: ["jsx"]

허용되는 파일 확장자 집합입니다. 앞의 점(예: "jsx" 또는 ".jsx")을 포함하거나 제외할 수 있습니다(둘 다 유효).

ignoreFilesWithoutCode

type: boolean

기본값: false

활성화된 경우, 코드가 없는 파일(즉, 빈 파일, 공백만 포함하거나 주석만 있는 파일)은 거부되지 않습니다.

사용 방법

이 규칙을 설정 파일 또는 명령줄 인터페이스에서 활성화하려면 다음과 같이 사용할 수 있습니다:

json
{
  "plugins": ["react"],
  "rules": {
    "react/jsx-filename-extension": "error"
  }
}
bash
oxlint --deny react/jsx-filename-extension --react-plugin

참고 자료