eslint

프론트엔드 개발환경의 이해와 실습 (webpack, babel, eslint..)

ESLint(풀이)

작성

PS C:\Users\Master\inflearn\lecture-frontend-dev-env> npx eslint --init

You can also run this command directly using 'npm init @eslint/config@latest'.

@eslint/create-config: v1.4.0

√ How would you like to use ESLint? · problems

√ What type of modules does your project use? · esm

√ Which framework does your project use? · none

√ Does your project use TypeScript? · javascript

√ Where does your code run? · browser

The config that you've selected requires the following dependencies:

eslint, globals, @eslint/js

√ Would you like to install them now? · No / Yes

√ Which package manager do you want to use? · npm

☕Installing...

npm WARN idealTree Removing dependencies.eslint in favor of devDependencies.eslint

added 2 packages, changed 1 package, and audited 799 packages in 2s

111 packages are looking for funding

run npm fund for details

설치가 됐는데 .eslintrc.js파일에 아무것도 안 뜨고 eslint.config.mjs파일이 설치됐어요

node.js 웹팩 babel eslint

답변 3

dkswndus6988

질문자

안녕하세요! 깃헙에 있는 패키지 버전을 사용하였는데 PS C:\Users\Master\inflearn\lecture-frontend-dev-env> npm run lint

> lecture-frontend-dev-env@1.0.0 lint

> eslint src --fix

Oops! Something went wrong! :(

ESLint: 9.14.0

ESLint couldn't find an eslint.config.(js|mjs|cjs) file.

From ESLint v9.0.0, the default configuration file is now eslint.config.js.

If you are using a .eslintrc.* file, please follow the migration guide

to update your configuration file to the new format:

https://eslint.org/docs/latest/use/configure/migration-guide

If you still have problems after following the migration guide, please stop by

https://eslint.org/chat/help to chat with the team. 이런 오류가 발생했습니다!

김정환

지식공유자

로그를 보면 ESLint 9.14.0 를 사용하신듯 합니다. 수업에서는 6버전을 사용하고 있어서 버전이 서로 안맞는게 원인 같아요.

https://github.com/jeonghwan-kim/lecture-frontend-dev-env/blob/master/package.json#L15

package.json 에 eslint 버전도 맞추어서 npm install 하신 뒤 다시 시도해 보세요.

김정환

지식공유자

이것도 사용하신 패키지 버전이 수업에서 사용한 것과 다른 게 원인 같습니다.

수업에서 사용한 패키지 버전과 비교해 보시고 다르다면 이 버전으로 맞춰서 시도해 주세요.

https://github.com/jeonghwan-kim/lecture-frontend-dev-env/blob/master/package.json

인프런 AI 인턴

안녕하세요, 인프런 AI 인턴입니다. dkswndus6988님이 경험하신 문제에 대해 좀 더 자세히 설명해드리겠습니다.

최근 ESLint 버전에서는 설정 파일로 .eslintrc.js 대신 새로운 형식의 eslint.config.mjs 파일을 생성할 수 있도록 변경되었습니다. 이는 모듈 시스템을 사용하는 프로젝트의 현대적 설정을 지원하기 위함입니다. 따라서, 이 설정 파일에 필요한 ESLint 설정이 들어가게 됩니다.

만약 .eslintrc.js를 사용하시길 원한다면, 기존 방식을 따로 수동으로 생성해주시거나, 프로젝트 환경에 맞게 .eslintrc.js 파일을 만들어주세요. eslint.config.mjs 파일의 내용을 참고해서 직접 설정을 옮겨오시면 됩니다.

아래는 ESLint 설정 파일에 들어갈 수 있는 기본 예제입니다:

module.exports = {
  env: {
    browser: true,
    es2021: true,
  },
  extends: 'eslint:recommended',
  parserOptions: {
    ecmaVersion: 12,
    sourceType: 'module',
  },
  rules: {
    // 여기에 원하는 규칙을 추가하세요
  },
};

또한 추가적인 사례나 설정에 대한 더 많은 정보는 ESLint 공식 문서를 참고하시면 도움이 될 것입니다.

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.

인프런 커뮤니티 질문&답변

eslint