console importer

Импортер консолей

Установка

Установите его из Интернет-магазина Chrome:

https://chrome.google.com/webstore/detail/console-importer/hgajpakhafplebkdljleajgbpdmplhie

Использование

Откройте консоль инструментов разработчика Chrome, функцию с именем $i можно использовать для импорта ресурсов JavaScript и CSS.

 $i ( 'jquery' )

Импортировать конкретную версию:

 $i ( 'jquery@2' )

Кроме того, вы можете импортировать действительный URL-адрес сценария:

 $i ( 'https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js' )

CSS также поддерживается:

 $i ( 'https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css' )

Импортировать модуль ES

Модуль ES широко поддерживается в современных браузерах. Метод $i.esm может быть полезен в этом случае:

 d3 = await $i . esm ( 'd3' )

или укажите версию:

 d3 = await $i . esm ( 'd3@7' )

Преимущество этого подхода заключается в том, что в окно не добавляются глобальные переменные, что позволяет лучше контролировать объем побочных эффектов. Для получения более подробной информации см. https://esm.run.

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

Вопрос: $i не работает должным образом.

На некоторых веб-сайтах, таких как Google Inbox, $i уже используется в качестве глобальной переменной. Это расширение не перезаписывает его.

Вы можете использовать console.$i на этих сайтах.

Вопрос: $i не удалось импортировать ресурсы.

На некоторых веб-сайтах, таких как GitHub, $i не сможет импортировать ресурсы. Ошибки консоли могут быть следующими:

 # js errors example
Refused to connect to ' https://api.cdnjs.com/libraries?search=jquery ' because it violates the following Content Security Policy directive:

# css errors example
Refused to load the stylesheet ' https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css ' because it violates the following Content Security Policy directive:

Это связано со строгой Политикой безопасности контента этих веб-сайтов. Дополнительные сведения см. в вики по политике безопасности контента (CSP).

Как это работает?

• Если оно похоже на имя библиотеки JavaScript, например jquery , попробуйте загрузить его из cdnjs.
• Если у него есть номер версии, например jquery@2 , попробуйте загрузить его из unpkg.
• Если это действительный URL-адрес (CSS или JS), загрузите его напрямую.

Для расширенного использования также есть две функции $i.unpkg и $i.cdnjs , которые можно использовать для импорта ресурсов из определенной CDN.

Лицензия

Массачусетский технологический институт