ESLint không hoạt động trong VS Code?

ESLint không hoạt động đối với tôi trong VS Code. Tôi đã cài đặt plugin trong VS Code và bản thân ESLint như một phần phụ thuộc vào nhà phát triển trong package.json của tôi, mà tôi cũng đã cài đặt.

Tôi đã sửa đổi tùy chọn sau trong Cài đặt Người dùng Mã VS:

{
  "eslint.options": { "configFile": "C:/mypath" }
}

Tôi đã sử dụng lệnh eslint --initđể thêm cơ bản .eslintrc.jsonvào thư mục chính của gói của tôi.

Những người khác có thể nhận phản hồi ESLint từ VS Code bằng cách sử dụng cùng một gói chính xác với cùng một tệp cấu hình ESLint chính xác.

Tôi không nhận được phản hồi nào dưới bất kỳ hình thức nào khi trực tiếp vi phạm nhiều quy tắc mà tất cả đều có trong bộ quy tắc được đề xuất, theo mặc định bên trong .eslintrc.jsontệp.

Tôi đang thiếu gì?

Chỉnh sửa: Tôi đã thử nghiệm bằng cách sử dụng ESLint thông qua dòng lệnh và mọi thứ hoạt động như mong đợi, với các lỗi được tìm thấy ở vị trí đáng lẽ mắc phải, tuy nhiên, những lỗi tương tự này không bao giờ xuất hiện trong VS Code. Vấn đề dường như nằm ở phía VS Code chứ không phải ESLint.

Có một số lý do mà ESLint có thể không đưa ra phản hồi cho bạn. ESLint sẽ tìm kiếm tệp cấu hình của bạn trước tiên trong dự án của bạn và nếu nó không thể tìm thấy .eslintrc.json ở đó, nó sẽ tìm kiếm cấu hình chung. Cá nhân tôi chỉ cài đặt ESLint trong mỗi dự án và tạo một cấu hình dựa trên mỗi dự án.

Lý do thứ hai khiến bạn không nhận được phản hồi là để nhận được phản hồi, bạn phải xác định các quy tắc in linting của mình trong .eslintrc.json. Nếu không có quy tắc nào ở đó hoặc bạn chưa cài đặt plugin nào thì bạn phải xác định chúng.

Nếu ESLint đang chạy trong thiết bị đầu cuối nhưng không chạy bên trong VSCode, có thể là do tiện ích mở rộng không thể phát hiện cả node_modulesthư mục cục bộ và thư mục chung.

Để xác minh, hãy nhấn Ctrl+ Shift+ Utrong VSCode để mở Outputbảng điều khiển sau khi mở tệp JavaScript có sự cố đã biết eslint. Nếu nó hiển thị Failed to load the ESLint library for the document {documentName}.js-hoặc- nếu Problemstab hiển thị lỗi hoặc cảnh báo đề cập đến eslint, thì VSCode đang gặp sự cố khi cố gắng phát hiện đường dẫn.

Nếu có, hãy đặt nó theo cách thủ công bằng cách định cấu hình eslint.nodePathtrong cài đặt VSCode ( settings.json). Cung cấp cho nó đường dẫn đầy đủ (ví dụ: như "eslint.nodePath": "C:\\Program Files\\nodejs",) - sử dụng các biến môi trường hiện không được hỗ trợ.
Tùy chọn này đã được ghi lại tại trang mở rộng ESLint .

Trong trường hợp của tôi, vì tôi đang sử dụng TypeScript với React, cách khắc phục chỉ đơn giản là yêu cầu ESLint cũng xác thực các tệp này. Điều này cần phải đi trong cài đặt người dùng của bạn:

"eslint.validate": [ "javascript", "javascriptreact", "html", "typescriptreact" ],

Định cấu hình các thư mục đang hoạt động đã giải quyết được vấn đề đó cho tôi, vì tôi đã có nhiều dự án với .eslintrccác tệp riêng mở ra trong cùng một cửa sổ.

Đặt cái này vào của bạn .vscode/settings.json

"eslint.workingDirectories": [
    "./backend", 
    "./frontend"
],

cảm ơn anh chàng này trên github: https://github.com/microsoft/vscode-eslint/issues/696#issuecomment-542592372

PS: lệnh hữu ích để liệt kê tất cả các thư mục con chứa .eslintrcngoại trừ / node_modules:

find . .eslintrc | grep .eslintrc | grep -v node_modules

Trong trường hợp của tôi, tôi chưa cài đặt tiện ích mở rộng ESLint của anh ấy trong VSCode, điều này đang gây ra sự cố. Đã làm và nó bắt đầu hoạt động trở lại.

Khởi động lại VSCode đã làm việc cho tôi.

Nếu bạn đang sử dụng cài đặt toàn cầu của ESLint, bất kỳ plugin nào được sử dụng trong cấu hình của bạn cũng phải được cài đặt trên toàn cầu. Giống như khôn ngoan cho cài đặt cục bộ. nếu bạn đã cài đặt cục bộ và được định cấu hình cục bộ đúng cách, nhưng eslint không hoạt động, hãy thử khởi động lại IDE của bạn. Điều này vừa xảy ra với tôi với VScode.

Tôi đã gặp sự cố tương tự trên windows, tuy nhiên đôi khi eslint hoạt động (trong vscode) đôi khi không. Sau đó tôi nhận ra rằng nó hoạt động tốt sau một thời gian. Nó liên quan đến vấn đề này: máy chủ eslint mất ~ 3-5 phút cho đến khi khả dụng

Đặt biến môi trường đã NO_UPDATE_NOTIFIER=1giải quyết được vấn đề

Tôi đang đưa ra phản hồi giả sử rằng bạn đã xác định các quy tắc trong gốc dự án cục bộ với .eslintrc và .eslintignore . Sau khi cài đặt VSCode Eslint Extension, một số cấu hình cần thực hiện trong settings.json cho vscode

eslint.enable: true
eslint.nodePath: <directory where your extensions available>

Cài đặt eslint local như một phần phụ thuộc của dự án là thành phần cuối cùng để nó hoạt động. xem xét không cài đặt eslint dưới dạng toàn cầu có thể xung đột với gói cài đặt cục bộ của bạn.

Tôi đã gặp sự cố tương tự với eslint nói rằng đó là '.. chưa xác thực bất kỳ tệp nào', nhưng không có gì được báo cáo trong bảng điều khiển sự cố VS Code. Tuy nhiên, sau khi nâng cấp VS Code lên phiên bản mới nhất (1.32.1) và khởi động lại, eslint bắt đầu hoạt động.

Trong trường hợp của tôi, ESLint đã bị vô hiệu hóa trong không gian làm việc của tôi. Tôi đã phải bật nó trong cài đặt tiện ích mở rộng vscode.

Vì bạn có thể lint thành công thông qua dòng lệnh, nên rất có thể sự cố nằm trong cấu hình của plugin ESLint .

Giả sử phần mở rộng được cài đặt đúng cách, hãy kiểm tra tất cả các thuộc tính cấu hình liên quan đến ESLint trong cả dự án (không gian làm việc) và do người dùng (toàn cầu) xác định settings.json.

Có một số thứ có thể được định cấu hình sai trong trường hợp cụ thể của bạn; đối với tôi, JavaScript đã bị vô hiệu hóa sau khi làm việc với TypeScript trong một dự án khác và cài đặt toàn cầu của tôi .json kết thúc như sau:

"eslint.validate": [
  { "language": "typescript", "autoFix": true }
 ]

Từ đây, nó là một sửa chữa đơn giản:

"eslint.validate": [
  { "language": "javascript", "autoFix": true },
  { "language": "typescript", "autoFix": true }
]

Điều này phổ biến đến mức ai đó đã viết một bài đăng trên blog về việc ESLint không hoạt động trong VS Code . Tôi chỉ cần thêm, kiểm tra cài đặt người dùng toàn cầu của bạn.json trước khi ghi đè cấu hình không gian làm việc cục bộ.

Trong trường hợp của tôi, thiết lập eslint validate thành: "eslint.validate": ["javascript", "javascriptreact", "html", "stylescriptreact"], đã hoạt động tốt.

Tôi sử dụng Sử dụng Prettier Formatter và ESLint VS Code mở rộng cùng nhau để vẽ và định dạng mã.

bây giờ hãy cài đặt một số gói bằng lệnh đã cho, nếu cần nhiều gói hơn, chúng sẽ hiển thị với lệnh cài đặt như một lỗi trong thiết bị đầu cuối cho bạn, vui lòng cài đặt chúng.

npm i eslint prettier eslint@^5.16.0 eslint-config-prettier eslint-plugin-prettier eslint-config-airbnb eslint-plugin-node eslint-plugin-import eslint-plugin-jsx-a11y eslint-plugin-react eslint-plugin-react-hooks@^2.5.0 --save-dev

bây giờ hãy tạo một tên tệp mới .prettierrc trong thư mục chính của dự án của bạn, bằng cách sử dụng tệp này, bạn có thể định cấu hình cài đặt của tiện ích mở rộng đẹp hơn, cài đặt của tôi là bên dưới:

{
  "singleQuote": true
}

bây giờ đối với ESlint, bạn có thể định cấu hình nó theo yêu cầu của mình, tôi khuyên bạn nên truy cập trang web của Eslint để xem các quy tắc ( https://eslint.org/docs/rules/ )

Bây giờ, hãy tạo một tên tệp .eslintrc.json trong thư mục chính của dự án của bạn, bằng cách sử dụng tệp đó, bạn có thể cấu hình eslint, cấu hình của tôi như sau:

{
  "extends": ["airbnb", "prettier", "plugin:node/recommended"],
  "plugins": ["prettier"],
  "rules": {
    "prettier/prettier": "error",
    "spaced-comment": "off",
    "no-console": "warn",
    "consistent-return": "off",
    "func-names": "off",
    "object-shorthand": "off",
    "no-process-exit": "off",
    "no-param-reassign": "off",
    "no-return-await": "off",
    "no-underscore-dangle": "off",
    "class-methods-use-this": "off",
    "prefer-destructuring": ["error", { "object": true, "array": false }],
    "no-unused-vars": ["error", { "argsIgnorePattern": "req|res|next|val" }]
  }
}

Trong trường hợp của tôi, nó không hoạt động vì tôi chỉ thêm một thư mục monorepo vào dự án, mặc dù tôi đã package.jsonđịnh cấu hình phần mở rộng và phần mở rộng. Tôi chỉ làm việc khi tôi thêm toàn bộ dự án (chứa package.jsontệp) vào Mã VS.

Nếu bạn đang phát triển một dự án với eslint dưới dạng phụ thuộc package.json, hãy đảm bảo rằng bạn chạy npm install. Điều đó đã sửa nó cho tôi.

Đối với tôi, tôi đã vô tình tắt ESLint khi một số lời nhắc được hiển thị bởi nó.

Thực hiện các bước dưới đây đã khắc phục sự cố cho tôi

1. Shift + Command + P và chọn ESLint: Disabled ESLint
2. Đóng vscode
3. Shift + Command + P và chọn ESLint: Show Output Channel

Đi tới tệp settings.json của bạn, thêm phần sau và sửa eslint.nodepath. Điều chỉnh nó theo sở thích của riêng bạn.

 // PERSONAL
  "editor.codeActionsOnSaveTimeout": 2000,
  "editor.codeActionsOnSave": {
    "source.fixAll": true
  },
  "editor.fontSize": 16,
  "editor.formatOnSave": true,
  "explorer.confirmDragAndDrop": true,
  "editor.tabSize": 2,
  "eslint.codeAction.showDocumentation": {
    "enable": true
  },
  "eslint.nodePath": "C:\\{path}",
  "eslint.workingDirectories": ["./backend", "./frontend"],

Trong trường hợp của tôi, tôi có .eslintrc.jsontệp bên trong .vscodethư mục. Khi tôi chuyển nó ra thư mục gốc, ESLint bắt đầu hoạt động bình thường.