Skip to content
← Back to rules

vue/no-lifecycle-after-await 정확성

작동 방식

비동기적으로 등록된 라이프사이클 훅을 금지합니다.

왜 좋지 않은가?

라이프사이클 훅은 setup() 실행 중에 동기적으로 등록되어야 합니다.
await 문장 이후에 라이프사이클 훅이 호출되면, 너무 늦게 등록될 수 있으며 예상대로 작동하지 않을 수 있습니다.

예시

이 규칙에 어긋나는 잘못된 코드 예시:

vue
<script>
import { onMounted } from "vue";
export default {
  async setup() {
    await doSomething();
    onMounted(() => {
      /* ... */
    }); // 오류
  },
};
</script>

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

vue
<script>
import { onMounted } from "vue";
export default {
  async setup() {
    onMounted(() => {
      /* ... */
    }); // 문제 없음
    await doSomething();
  },
};
</script>

사용 방법

이 규칙을 구성 파일 또는 CLI를 통해 활성화하려면 다음을 사용할 수 있습니다:

json
{
  "plugins": ["vue"],
  "rules": {
    "vue/no-lifecycle-after-await": "error"
  }
}
bash
oxlint --deny vue/no-lifecycle-after-await --vue-plugin

참고 자료