Как исправить предупреждение WebStorm о функции «require»

Быстрый ответ

Чтобы устранить предупреждение WebStorm "Unresolved function or method" вам следует определить директорию addon-sdk как Resource Root в настройках вашей среды разработки – это позволит WebStorm правильно индексировать модули SDK для глубокого анализа кода. В качестве альтернативы вы можете создать заглушки CommonJS для модулей SDK, объявив в новом .js файле макеты переменных и методов, которые вам требуются из require. Пример такой заглушки представлен ниже:

// Заглушка для модуля SDK – tabs.js
module.exports = {
  open: function() {}, // Функция-заглушка, для предотвращения бесконтрольного открытия вкладок.
  // Добавление других методов производится по мере их необходимости.
};

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

Подготавливаемся к работе

Правильное настройка

Следующие параметры в WebStorm обеспечивают корректное распознавание и загрузку модулей:

• Активировав библиотеку Node.js Globals в закладке Settings | Languages & Frameworks | JavaScript | Libraries вы добавите необходимые глобальные объекты в ваш проект.
• Включение автодополнения кода для Node.js расширит возможности WebStorm.
• Обновите WebStorm до любой версии, поддерживающей конфигурацию библиотеки Node.js Core – рекомендуется версия 2018.3.2 или более новая.

• Проверьте интеграцию с Node.js в настройках Settings | Languages & Frameworks | JavaScript | Libraries.

  Подробнее об этом расскажет наш спикер на видео

  

  Углубляемся в общение с TypeScript

  Добавление строки "types": ["node"] в файл tsconfig.json включает поддержку функции require() в проектах на TypeScript.

Нейтрализуем предупреждения

Очистите кэш и перезапустите WebStorm, а если эти действия не помогли, прочитайте документацию WebStorm для решения затруднений, связанных с функцией require().

Когда WebStorm становится упорным

Если проблемы все еще не устранены, то стоит призадуматься о альтернативных средах разработки, которые лучше поддерживают работу с Firefox Add-on SDK.

Оптимизируем рабочий процесс

Подходящая настройка

Ключ к бесперебойной работе:

• Добавьте в проект require.js для улучшения использования функциональности require.
• В TypeScript проектах используйте команду npm install @types/node --save-dev, чтобы добавить определения типов Node.js.

Используем дополнительные возможности IntelliJ IDEA

Включите специализированные настройки в IntelliJ IDEA для улучшения работы с проектами.

И... Вперед!

WebStorm версий WebStorm 11, 2016.2.3 и более новые обладают улучшенными функциями для управления упомянутыми настройками.

Визуализация

Представьте ситуацию, когда строитель (👷‍♂️) не может увидеть свои инструменты (🧰)—также и WebStorm "не замечает" определенные компоненты:

WebStorm: 👁️👷‍♂️🔍🧰❓
// WebStorm не видит инструменты,

Мы можем сделать инструменты видимыми для WebStorm, добавив "метку":

// Делаем инструменты видимыми для WebStorm:
/** @type {require} */

WebStorm: 👁️👷‍♂️🧰✅
// Теперь работа может продолжаться без сбоев!

Взаимодействуем с сообществом

Получим, что просим

Обратитесь в службу поддержки WebStorm или посетите форумы сообщества за советом или помощью.

Следите за обновлениями

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

Функциональное управление модулями

Убедитесь, что ваш проект использует NPM или Yarn для успешной работы функции require().

Полезные материалы

1. Кадька приложение JavaScript библиотек в WebStorm — Официальное руководство по настройке JavaScript библиотек.
2. Stack Overflow: Как подавить "Unresolved Function" ошибки в WebStorm — Дискуссия о методах устранения предупреждений в WebStorm на Stack Overflow.
3. ES Modules и Node.js – NodeSource — Статья о выборе между require() и ES6 import/export в Node.js.