JSHint и jQuery: '$ ' не определен
Следующие JS:
(function() {
"use strict";
$("#target").click(function(){
console.log("clicked");
});
}());
Выходы:
test.js: line 5, col 3, '$' is not defined.
, Когда linted используя у JSHint 0.5.5. Есть идеи?
8 ответов:
Если вы используете относительно новую версию JSHint, обычно предпочтительным подходом является создание a .jshintrc файл в корне вашего проекта, и поместите в него эту конфигурацию:
{ "globals": { "$": false } }
Это объявляет JSHint, что $ является глобальной переменной, а false указывает, что ее не следует переопределять.
The .файл jshintrc не поддерживается в очень старых версиях у JSHint (например, версии v0.5.5 как оригинальный вопрос в 2012 году). Если вы не можете или не хотите использовать его .jshintrc файл, вы можете добавить это в верхней части файла скрипта:
/*globals $:false */
Существует также сокращенная опция jshint "jquery", как показано на странице JSHint options..
Вы также можете добавить две строки в свой .jshintrc
"globals": { "$": false, "jQuery": false }
Это говорит jshint, что есть две глобальные переменные.
Все, что вам нужно сделать, это установить
"jquery": true
в вашем.jshintrc
.По ссылке JSHint options:
Jquery
Этот параметр определяет глобалы, предоставляемые библиотекой JavaScript jQuery.
Вот счастливый маленький список, чтобы положить в свой .jshintrc
Я добавлю к этому списку по прошествии времени.{ // other settings... // ENVIRONMENTS // "browser": true, // Is in most configs by default "node": true, // others (e.g. yui, mootools, rhino, worker, etc.) "globals": { "$":false, "jquery":false, "angular":false // other explicit global names to exclude }, }
Если вы используете редактор IntelliJ, такой как WebStorm, PyCharm, RubyMine или IntelliJ IDEA:
В разделе Environments раздела File/Settings/JavaScript/code Quality Tools/JSHint установите флажок jQuery.
Вместо того, чтобы рекомендовать обычное "отключить глобалы JSHint", я рекомендую использовать шаблон модуля для решения этой проблемы. Он сохраняет ваш код "сдержанным"и повышает производительность (на основе работы Пола Айриша "10 вещей, которые я узнал о Jquery" ).
Я обычно пишу свои шаблоны модулей так:
(function (window) { // Handle dependencies var angular = window.angular, $ = window.$, document = window.document; // Your application's code }(window))
Вы можете получить эти другие преимущества производительности (подробнее здесь):
- при уменьшении кода передаваемый в
window
объект декларация также будет уменьшена. например,window.alert()
становитсяm.alert()
.- код внутри самоисполняющейся анонимной функции использует только 1 экземпляр объекта
window
.- вы переходите к преследованию при вызове свойства или метода
window
, предотвращая дорогостоящий обход цепочки областей, напримерwindow.alert()
(быстрее) противalert()
(медленнее) производительности.- локальная область функций через "пространство имен" и сдерживание (глобалы-зло). Если вам нужно разбить этот код на отдельные скрипты, вы можете создать подмодуль для каждого из этих сценариев и импортировать их в один основной модуль.
Чтобы исправить эту ошибку при использовании онлайн-реализации JSHint:
- Нажмите кнопку "Настроить" (вверху среднего столбца на странице)
- включить "jQuery "(в разделе "предполагать" внизу)