Недавно начал играть со Svelte по шаблону sveltejs. Все работает нормально, однако, когда я вношу какие-либо изменения в файлы, он не перезагружает изменения в веб-браузере, поэтому мне приходится вручную обновлять страницу, чтобы увидеть изменения. Есть ли в настройках какой-либо параметр для включения этой функции, или на данный момент это невозможно?
Проблема с горячей перезагрузкой Svelte
comment
Добро пожаловать в Stack Overflow, Бен! В Svelte 3 пока нет горячей перезагрузки, но вы можете автоматически обновлять браузер при изменениях, например, с помощью подключаемый модуль LiveReload Rollup.
- person Tholle schedule 25.04.2019
comment
В 2020 году можно дождаться появления SvelteKit svelte.dev/blog/whats-the- deal-with-sveltekit, заменяющий Rollup (в dev) на Snowpack. Официальный HMR.
- person akauppi schedule 13.11.2020
Ответы (2)
В шаблоне по умолчанию (https://github.com/sveltejs/template) используется Rollup, который не поддерживает горячую перезагрузку модуля. Версия webpack (https://github.com/sveltejs/template-webpack) будет поддерживать HMR, но сначала нам нужно добавить несколько хуков в сам Svelte, чтобы это стало возможным. Возникла проблема, которую вы можете отслеживать здесь. Надеюсь, мы скоро сможем выполнить эту работу. .
До тех пор предложение Толле об использовании плагина livereload, вероятно, является лучшим компромиссом.
person
Rich Harris
schedule
25.04.2019
Комментарий из Twitter предполагает, что Nollup можно использовать для HMR в проекте Rollup - я сам не использовал его, YMMV, но это звучит многообещающе mobile.twitter.com/PepsRyuu/status/1121808611217420290
- person Rich Harris; 26.04.2019
Отличная работа, Рич, я очень впечатлен v3. Есть идеи и сроки о поддержке TypeScript?
- person Ben Dev; 27.04.2019
Никаких сроков, нет - просто «когда мы вернемся к этому». Но это приоритет!
- person Rich Harris; 29.04.2019
Только что протестировали
npx degit sveltejs/template my-app и npx degit "sveltejs/sapper-template#rollup" my-app, npm install, а затем npm run dev, и оба шаблона работают с HMR из коробки. 2020-05-03
- person lowtechsun; 03.05.2020
Чтобы спорить с автором о его собственных библиотеках, я собираюсь возразить, что принятый ответ неверен.
Rollup может иметь HMR с rollup-plugin-hot. Как ранее отмечалось в комментариях, Nollup тоже может это сделать.
С его помощью вы можете отправить обновленный код в браузер и обновить (т.е. уничтожить + воссоздать) все приложение без перезагрузки страницы. Однако это не намного лучше, чем полная перезагрузка страницы.
Вы хотите заменить только компоненты Svelte, на которые влияет обновление кода, чтобы сохранить текущее состояние вашего приложения и, насколько это возможно, вы также хотите, чтобы состояние обновленных компонентов также сохранялось. Для этого вы можете использовать rollup-plugin-svelte-hot с Rollup / Nollup. или svelte-loader-hot с помощью Webpack.
В ожидании официальной поддержки я поддерживаю клоны официальных шаблонов + HMR: svelte-template-hot для Rollup / Nollup и svelte-template-webpack-hot для Webpack. Также существует sapper-template-hot для Sapper (поддерживает только Webpack). И, для полноты, svelte-native-template (не поддерживаемый мной) также включает HMR служба поддержки.
HMR до сих пор официально не поддерживается Svelte. Проблема, упомянутая в ответе Рича, закрыта. Теперь можно отслеживать прогресс в этой проблеме.
(Конечно, ответ Рича был правильным, когда он был написан изначально. И он по-прежнему верен с официальной точки зрения. И этот ответ - беспардонная попытка рекламировать мои собственные проекты, потому что этот вопрос занимает довольно высокое место в Google, но я надеюсь, что это так тем не менее полезно.)
person
rixo
schedule
25.11.2019
