Меню

Jshint не показывает ошибки

Как установить и настроить JSHint

При написании JavaScript кода, новички неизбежно допускают ошибки и это нормально. Плагин JSHint как раз позволяет вовремя увидеть все допускаемые ошибки, когда вы пишите свой код в редакторе. На этом уроке мы рассмотрим как установить и настроить данный плагин для редактора VS Code.

Установка JSHint для VS Code

Для работы плагина JSHint, у вас уже должна быть установлена среда Node.js.

Шаг 1) Включите плагин JSHint во вкладке «Расширения»

Шаг 2) Установите npm пакет

NPM это менеджер пакетов, входящий в состав Node.js. В веб-разработке уже существует много готовых решений: компиляторы, плагины и еще много всего полезного. С помощью пакетного менеджера можно быстро все эти полезности устанавливать и что немаловажно, находится они будут в одном месте на вашем компьютере.

Для установки плагина глобально, откройте вкладку «Терминал», введите команду npm install -g jshint и нажмите клавишу «ENTER». Вместо слова install, можно прописать сокращенное название«i».

Как установить и настроить JSHint.

Теперь проверим, как это все работает. Сделаем намеренно ошибки в коде. Например пропустим точку с запятой на конце. Плагин сразу подчеркивает проблемное место волнистой линией, а во вкладке терминала «Проблемы», сразу выводится сообщение. JSHint подсказывает, что на второй строчке нет точки с запятой.

Как установить и настроить JSHint.

Предупреждения обозначаются желтым треугольником, а критические ошибки — красным кружком с крестиком. Наличие критических ошибок в коде, делает его совершенно не рабочим. Именно на такие ошибки нужно всегда в первую очередь обращать внимание.

Как установить и настроить JSHint.

Плагин JSHint очень полезный и удобный инструмент, который подскажет, где у вас проблема. Но есть одна особенность. О ней мы сейчас и поговорим. Дело в том, что после установки, плагин работает по стандартным настройкам. Зачастую «заводские» настройки ориентируются на старые форматы кода. Нас это совсем не устраивает, поэтому необходимо откорректировать настройки JSHint.

Настройка JSHint для VS Code

Создайте внутри проекта системный файл .jshintrc и пропишите внутри файла свои оптимальные настройки. Системные файлы могут не показываться, чтобы увидеть их, необходимо настроить показ скрытых файлов. Файл с настройками, находящийся внутри проекта будет влиять только на этот проект. Чтобы не копировать файл .jshintrc из проекта в проект, поместите его в общую папку с проектами.

Пример файла .jshintrc

При помощи этих опций можно задавать стилистику кода и задавать определенные условия по работе плагина.


{
    "camelcase" : true, // Названия переменных в camelCase стиле

    "undef" : true, // Все не глобальные переменные должны быть объявлены до их использования.

    "quotmark" : true, // Согласованность стиля кавычек

    "maxlen" : 120, // Максимальная длина строки

    "trailing" : true, // Запрещены пробелы на концах.

    "curly" : true, // Фигурные кавычки обязательны для каждого нового блока или области.

    "strict" : true, // Обязательно строгое использование.

    "browser" : true, // Стандартный браузер `window`, `document`.

    "devel" : true, // Разрешена панель разработчика `console.log();`.

    "jquery" : true, // Опция определяет глобальные переменные, предоставляемые библиотекой jQuery.

    "esversion" : 8, // Включить функции, представленные в ECMAScript 8.

    "node" : true // Определяет доступные глобальные переменные.

}

В этом уроке мы научились работать с одним из самых полезных инструментов для Front-End разработчика. JSHint будет в автоматическом режиме указывать на недочеты и ошибки в нашем коде. Теперь никакие синтаксические ошибки, опечатки и прочие мелочи не испортят ваш код!

  • Создано 03.07.2020 10:05:12


  • Михаил Русаков

Копирование материалов разрешается только с указанием автора (Михаил Русаков) и индексируемой прямой ссылкой на сайт (http://myrusakov.ru)!

Добавляйтесь ко мне в друзья ВКонтакте: http://vk.com/myrusakov.
Если Вы хотите дать оценку мне и моей работе, то напишите её в моей группе: http://vk.com/rusakovmy.

Если Вы не хотите пропустить новые материалы на сайте,
то Вы можете подписаться на обновления: Подписаться на обновления

Если у Вас остались какие-либо вопросы, либо у Вас есть желание высказаться по поводу этой статьи, то Вы можете оставить свой комментарий внизу страницы.

Если Вам понравился сайт, то разместите ссылку на него (у себя на сайте, на форуме, в контакте):

  1. Кнопка:

    Она выглядит вот так: Как создать свой сайт

  2. Текстовая ссылка:

    Она выглядит вот так: Как создать свой сайт

  3. BB-код ссылки для форумов (например, можете поставить её в подписи):

Здравствуйте.
Возникла небольшая проблема с Sublime Text 3, а именно с его плагином Sublime Linter.
Что я делал:
— Установил Sublime Linter.
— Установил Sublime Linter — jshint.
— Установил Node.js (v 0.10.25)
— Установил npm (v. 1.3.10)
— Установил пакет jshint (sudo npm install -g jshint)
Перезагрузил редактор, открыл тестовый js-файл,но ошибки не подсветились..SL высветил No lint errors.
Консоль,каких-либо,ошибок не показала.

Конфиги плагина:
(Setting — Default)

{
    "default": {
        "debug": false,
        "delay": 0.25,
        "error_color": "D02000",
        "gutter_theme": "Packages/SublimeLinter/gutter-themes/Default/Default.gutter-theme",
        "gutter_theme_excludes": [],
        "lint_mode": "background",
        "mark_style": "outline",
        "no_column_highlights_line": false,
        "passive_warnings": false,
        "paths": {
            "linux": [],
            "osx": [],
            "windows": []
        },
        "python_paths": {
            "linux": [],
            "osx": [],
            "windows": []
        },
        "rc_search_limit": 3,
        "shell_timeout": 10,
        "show_errors_on_save": false,
        "show_marks_in_minimap": true,
        "syntax_map": {
            "python django": "python",
            "html 5": "html",
            "html (django)": "html",
            "html (rails)": "html",
            "php": "html"
        },
        "warning_color": "DDB700",
        "wrap_find": true
    }
}

(Setting — User)

{
    "user": {
        "debug": false,
        "delay": 0.25,
        "error_color": "D02000",
        "gutter_theme": "Packages/SublimeLinter/gutter-themes/Default/Default.gutter-theme",
        "gutter_theme_excludes": [],
        "lint_mode": "background",
        "linters": {
            "jshint": {
                "@disable": false,
                "args": [],
                "excludes": []
            }
        },
        "mark_style": "fill",
        "no_column_highlights_line": false,
        "passive_warnings": false,
        "paths": {
            "linux": [],
            "osx": [],
            "windows": []
        },
        "python_paths": {
            "linux": [],
            "osx": [],
            "windows": []
        },
        "rc_search_limit": 3,
        "shell_timeout": 10,
        "show_errors_on_save": true,
        "show_marks_in_minimap": true,
        "syntax_map": {
            "html (django)": "html",
            "html (rails)": "html",
            "html 5": "html",
            "php": "html",
            "python django": "python"
        },
        "warning_color": "DDB700",
        "wrap_find": true
    }
}

Операционная система — Ubuntu 14.04.

Подскажите,пожалуйста,что,я сделал неправильно.
Спасибо,за уделенное время.

Каждый раз, когда код Visual Studio запускается или загружается, он отображает сообщение об ошибке: « Не удалось загрузить библиотеку jshint. Пожалуйста, установите jshint в папку рабочей области, используя ‘npm install jshint’, или глобально, используя ‘npm install -g jshint’, а затем нажмите Retry «. Есть ли доступное решение?

4 ответа

Лучший ответ

Вам нужно будет следовать инструкциям и установить jshint.

Только для рабочего пространства < Код > npm установить jshint

Или

Для всех ваших рабочих мест < Код > npm установить -g jshint


13

Wade Anderson
2 Май 2016 в 15:12

У меня была эта проблема, когда я установил jshint, используя yarn глобально (yarn global add jshint). Я добавил следующие свойства в settings.json для User для решения проблемы:

"jshint.packageManager": "yarn",
"jshint.nodePath": "/usr/local/lib/node_modules/"

Первое свойство, т.е. jshint.packageManager указывает, что yarn используется для управления node пакетами вместо npm. Второй, то есть jshint.nodePath указывает путь к установке jshint. Чтобы проверить, успешно ли загружен jshint, я открыл командный поддон ( CTRL + 3 ) и выполнил команду JSHint: Show output, которая показала это сообщение в выходных данных. :

jshint library loaded from /usr/local/lib/node_modules/jshint/src/jshint.js

Это указывало на то, что проблема была решена. После этого сообщения jshint появились в файлах *.js.


1

Abdollah
11 Сен 2019 в 12:27

Чтобы применить изменения к глобальной области, а не только к определенной рабочей области, используйте следующую команду в терминале: —

npm install -g jshint

Для определенного рабочего пространства используйте следующую команду в терминале: —

npm install jshint


0

Rakesh Chandra
10 Июн 2018 в 15:23

В VS Code скачала jshint.
После этого выдает ошибку: Failed to load jshint library. Please install jshint in your workspace folder using ‘npm install jshint’ or globally using ‘npm install -g jshint’ and then press Retry. — Не удалось загрузить библиотеку jshint.
Перевод: Пожалуйста, установите у JSHint в рабочей области папки с помощью ‘НПМ установить у JSHint или глобально, используя ‘НПМ установки -G и у JSHint и затем нажмите кнопку Повторить.
Что сделано:
1.Добавила файл jshintrc в общую рабочую папку.
2. В терминале прописала варианты npm install jshint и npm install -g jshint (увидела как вариант, когда искала ответ в инете.) Сделала скрин ошибки.
Вопрос:
Как исправить ошибку,чтобы jshint работал, прошу, напишите по пунктам?

Скрин ошибки

задан 20 мар 2020 в 20:15

Ирина's user avatar

У тебя пишет «npm не является внутренней или внешней командой, исполняемой программой или пакетным файлом». Отсюда у меня возникает вопрос, установлен ли у тебя Node.js, если нет, то тебе нужно скачать его на nodejs.org

ответ дан 20 мар 2020 в 21:57

Andrey Freiz's user avatar

Andrey FreizAndrey Freiz

7375 серебряных знаков16 бронзовых знаков

2

I researched for a solution to this problem on jshint documentation page and through questions in this forum. I didn’t see anything that addresses my problem. I have node.js installed as well as sublimelinter and jshint. In my command line I typed npm node.js and npm jshint and saw that they were installed. I followed the instructions from videos I saw on sublimetext tutorials on YouTube. I purposely made errors in my code but jshint doesn’t show them. Here is a screenshot of my code.
enter image description here

And here is the code in sublimetext3 editor.

// JavaScript Document
 var image = document.getElementById('myCities');

 var imageArray =    ['photos/photo1.jpg','photos/photo2.jpg','photos/photo3.jpg','photos/photo4.jpg',     'photos/photo5.jpg','photos/photo6.jpg','photos/photo7.jpg'];

 var imageIndex = 0;

 function changeCities(){

myCities.setAttribute('src', imageArray [imageIndex]);
imageIndex++;
if(imageIndex>=imageArray.length){
    imageIndex=[0];
}

 }
 var intervalHandle = setInterval(changeCities, 3000);

 myCities.onclick = function(){
clearInterval(intervalHandle);
 };
function()
foo = name //this is the error:no brackets for the function, variable is     undefined and the semicolon is left out.

I’d appreciate any suggestions on what I can do to get jshint to work properly.

0 0 голоса
Рейтинг статьи
Подписаться
Уведомить о
guest

0 комментариев
Старые
Новые Популярные
Межтекстовые Отзывы
Посмотреть все комментарии

А вот еще интересные материалы:

  • Яшка сломя голову остановился исправьте ошибки
  • Ясность цели позволяет целеустремленно добиваться намеченного исправьте ошибки
  • Ясность цели позволяет целеустремленно добиваться намеченного где ошибка
  • Jquery ajax обработчик ошибок
  • Jquery ajax обработка ошибок