Я часто использую «просмотр источника» в Firefox, когда сталкиваюсь с интересной веб-страницей. Это полезно в качестве учебной возможности, чтобы увидеть, как страница собрана.
К сожалению, стандартное окно просмотра источника в Firefox довольно спартанское. Есть только минимальная цветовая подсветка (много черного текста с синими гиперссылками), нет переформатирования кода для пробелов и читаемости и т. Д. На мой взгляд, это довольно нечитаемо.
Я бы предпочел прочитать базовый HTML / CSS / JS-код непосредственно в VS Code [или вставить предпочитаемую IDE здесь]. Таким образом, код будет отформатирован с моими предпочтительными шрифтами, цветами, отступами, строчками и т. Д. Я также могу использовать Prettier для очистки любого странного форматирования и пробелов.
Очевидно, я могу вручную загрузить файл HTML или скопировать / вставить содержимое и открыть его в VS Code. Но это хлопотно, особенно если мне также нужны другие вспомогательные файлы (CSS и JS). Я также мог бы написать сценарий оболочки, который использует wget, но я бы предпочел не изобретать велосипед заново.
Есть ли более простые решения для этого? Я хотел бы рабочий процесс, как следующий:
- Я нашел интересную, случайную веб-страницу.
- Я нажимаю «загрузить в VS Code», используя какой-нибудь плагин для браузера (отказ от рук). Либо я открываю VS Code и вписываю URL в расширение VS Code (отказ от руки).
- Все связанные файлы (HTML, CSS, JS) для этой конкретной страницы затем автоматически загружаются в некоторую папку по умолчанию.
- VS Code автоматически открывает эту папку, чтобы я мог просматривать отдельные файлы.
Если бы файлы могли быть сохранены во временную папку, так что мне не пришлось бы забывать удалить их позже, это было бы еще лучше.
Существуют ли какие-либо плагины для браузера или расширения VS Code, которые позволили бы мне сделать что-то подобное?