Ответ
После сохранения файла изменения можно увидеть несколькими способами:
- Автоматическая перезагрузка - если используется сборщик (Webpack, Vite) с hot-reload, страница обновится сама. Например, в Vite:
// vite.config.js
export default {
server: {
hmr: true // включен по умолчанию
}
}
-
Ручное обновление - F5 или Ctrl/Cmd + R в браузере.
-
Живой сервер - инструменты типа Live Server в VS Code автоматически перезагружают страницу при изменениях.
-
Отключение кэша - в DevTools (F12) во вкладке Network можно включить "Disable cache" для разработки.
Для CSS иногда достаточно просто обновить стили без перезагрузки страницы через вкладку Elements в DevTools.
Ответ 18+ 🔞
А, ну ты смотри, файл сохранил, а теперь сидишь и думаешь: "И где, блядь, мои изменения, ёпта?". Спокойно, не дергайся. Есть несколько способов это проверить, как говаривал мой дед, "не одним же хуем мазано".
1. Автоматическая перезагрузка, мать её.
Если ты юзаешь какой-нибудь модный сборщик вроде Webpack или Vite, он, скорее всего, сам всё подхватит. Это называется hot-reload, типа "ой, чел, я вижу, ты файлик поменял — ща всё обновлю, сиди не пылись". В Vite, например, это обычно само собой работает:
// vite.config.js
export default {
server: {
hmr: true // это и так по дефолту true, но если ты его не вырубил — всё летает
}
}
2. Ручной метод, для консерваторов.
Просто жми F5 или, если ты из тех, кто любит покомандовать, Ctrl + R (или Cmd + R на маках). Старо, как говно мамонта, но работает безотказно. Иногда надо с зажатым Shiftом, чтобы кэш почистить нахуй.
3. Live Server — инструмент для ленивых гениев.
В том же VS Code есть плагин Live Server. Включил — и он, сука, сам следит за файлами и перезагружает браузер, как только ты что-то сохранил. Сидишь, кодишь, а он там в фоне уже всё приготовил. Красота, блядь.
4. Ядрёна вошь, кэш!
Бывает, браузер такой хитрожопый, что держит старую версию файла. Заходишь в DevTools (F12), вкладка Network, и ставишь галочку "Disable cache". Всё, теперь он каждый раз будет тащить свежее, как будто только что из духовки.
А, и ещё лайфхак для CSS. Если ты просто стили правил, иногда даже перезагрузка не нужна. Открываешь DevTools, вкладка Elements, находишь свой стиль и меняешь его прямо там — увидишь результат мгновенно. Потом уже копируешь обратно в файл. Удобно, ёпта.
В общем, вариантов — овердохуища. Выбирай любой, главное — не сиди и не жди, что само рассосётся.