Як використовувати WebStorm для розширення Chrome?


104

Я щойно купив WebStorm 5 і до цих пір дуже насолоджувався його функціями перевірки. Один замах, до якого я зіткнувся, розробляючи розширення Chrome, - це те, що він не розпізнає chromeзмінну:

Нерозв’язаний хром змінної чи типу

Чи є спосіб я додати chromeзмінну до Інспектора, щоб вона могла автоматично заповнитися під час введення тексту? Я здогадуюсь, мені потрібно було б додати Chromium як зовнішню бібліотеку, але я не знаю, з чого почати.

Відповіді:


215

Перша настройка часу

  1. Відкрийте Settingsдіалогове вікно ( File> Settings)

  2. Натисніть Languages & Frameworks> Javascript>Libraries

  3. Клацніть Download

  4. Переконайтесь, що TypeScript community stubsвибрано

  5. Виберіть chromeзі списку (ви можете швидко знайти його, просто ввівши chrome)

  6. Клацніть Download and Install

  7. Клацніть, OKщоб закрити діалогове вікно налаштувань.


Кроки 2-6 проілюстровані нижче:

Скріншот веб-штормів


У подальших проектах

У будь-якому наступному проекті ви просто:

  1. SettingsЗнову відкрийте діалогове вікно ( File> Settings)

  2. Натисніть Languages & Frameworks> Javascript> Librariesще раз

  3. Перевірити chrome-DefinitelyTyped

  4. Клацніть, OKщоб закрити діалогове вікно.


Кроки 2-4 показані нижче:

Скріншот веб-шторму


3
Працює так само добре в Intellij
Оскар Ферм

2
Оновлена ​​відповідь потрібна, оскільки IntelliJ IDEA 2017.1 не відображає "chrome" під "заглушками спільноти TypeScript". Будь-яка ідея, як додати це?
Reem

1
Виявилася помилка в IntelliJ IDEA 2017.1 youtrack.jetbrains.com/issue/WEB-26160#u=1490671035044
Reem

1
На mac ім'я не налаштування, а уподобання. Але ви можете отримати доступ до нього за допомогоюcommand+,
Ulysse BN

4
Напевно, слід зазначити, що WebStorm потрібно буде перезапустити.
Тайлер Кромптон

42

ОНОВЛЕННЯ 2 :

Зараз це підтримується з вікна, повну відповідь дивіться нижче .

Завантажити бібліотеку

ОНОВЛЕННЯ :

Є більш повний файл заглушки, який можна додати як бібліотеку для отримання коду. Це частина проекту компілятора закриття. Завантажте chrome_extensions.js .

Дивіться також запит на функцію WebStorm для автоматичного додавання цієї бібліотеки з IDE.


Вам потрібно десь отримати бібліотеку JavaScript для API Chrome або скористатися заглушкою, щоб отримати базове завершення .

Бібліотеку або заглушку можна налаштувати в WebStorm .


Я знайшов файли JSON за допомогою API Extension . Можна написати сценарій, який буде створювати JS-заглушки з цих файлів JSON, заглушки можуть виглядати як основна версія, пов’язана на GitHub вище, але при автоматичному генеруванні вони містять майже повний коментар API та JSDoc, так що документацію, як тут, можна переглянути безпосередньо в IDE.

JSON => Зображення заглушок об’єктів JavaScript в цьому випадку досить просте, і написання такого перетворювача не має займати більше доби (або декількох годин для кваліфікованого кодера).

Якщо хтось продовжує і реалізує це, будь ласка, опублікуйте посилання на результати тут.


Дякую, мені найкраще подобається ця ідея. Я фактично закінчив клонування Chromium Git Repo і додав папку, /chrome/renderer/resources/extensionsяка дала мені більшу частину того, що я хотів для перевірки.
матюк

sirlancelot - не працює для мене ... чи можете ви розмістити тут якийсь снайпер, який має автоматичне доповнення після додавання цього dir як бібліотеки до WebStorm (або IntelliJ)?
Michal Bernhard

2
Я завантажив розширення Chrome, але щоб позбутися Unresolved variableпопередження в WebStorm, мені довелося додати наступний рядок до chrome_extension.js: var chrome = {}та включити його як бібліотеку до свого проекту.
МК Сафі

Існує також досить недавній (грудень 2013) файл vsdoc за адресою code.google.com/p/chrome-api-vsdoc . У ньому є описи об'єктів, методів та параметрів (яких не вистачає цій версії TypeScript). Описи дещо збиті під час перегляду за допомогою Ctrl-Q завдяки vsdoc, використовуючи XML для анотацій doc, але все ще читаються та користуються. Просто додайте завантажений vsdoc як користувацьку бібліотеку JS у Webstorm.
Борис Б.

2

WebStorm повинен один день приймати визначення json безпосередньо, щоб увімкнути автозаповнення для визначених функцій. Тим часом ви можете використовувати програму за адресою https://github.com/QuickrWorld/jsgen для перетворення файлів json в js, щоб увімкнути автоматичне завершення API-програм для розширення хрому.


1

Для написання AppScript, функцій та класів, таких як DriveApp , SpreadsheetApp , в WebStorm або Intellij є плагін під назвою google-app-script.
Спосіб установки такий же, як і вище. З іншого боку, слід позначити або відкрити .gs-файл як JavaScript. (Липень 2017 р.)

Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.