Может ли кто-нибудь помочь мне понять разницу между пакетами npm nodemon и live-server, поскольку они оба перезагружают сервер и прослушивают изменения?





Они служат двум разным целям.
Nodemon перезапустит Приложение узла при обнаружении изменений файла в каталоге.
Live-сервер, с другой стороны, будет обновлять ваш браузер при обнаружении изменений в любых поддерживаемых типах файлов (например, HTML, JS, CSS). Он также включает запросы Ajax, когда вы работаете локально — они обычно не работают с протоколом file://.
Нодемон
Чтобы увидеть это в действии, давайте создадим простой сервер Node.
Сначала создайте каталог my-app, перейдите в него, создайте файл package.json и файл с именем server.js. В системе 'nix, например:
mkdir my-app
cd my-app
npm init -y
touch server.js
Затем в server.js добавляем:
const http = require('http');
const server = http.createServer(function (request, response) {
response.writeHead(200, {"Content-Type": "text/plain"});
response.end("Hello, World!\n");
});
server.listen(8000);
console.info("Server running at http://127.0.0.1:8000/");
Теперь, если вы запустите node server.js и посетите http://127.0.0.1:8000/ в своем браузере, вы увидите «Hello, World!» сообщение.
Если вы отредактируете server.js, например, изменив сообщение на «До свидания, мир!», а затем обновите браузер, вы все равно увидите исходное «Привет, мир!» сообщение.
Чтобы увидеть изменения, вам нужно остановить приложение (с Ctrl + C), затем перезапустить его (с node server.js), а затем обновить браузер.
Что делает nodemon, так это обертывает ваше приложение Node, чтобы автоматизировать этот шаг ручной остановки и перезапуска приложения.
Установите его как зависимость разработчика:
npm i -D nodemon
И запустите ваше приложение так:
./node_modules/.bin/nodemon server.js
Теперь, когда вы вносите изменения в server.js, nodemon обнаружит это автоматически, а это означает, что все, что вам нужно, это обновить браузер, чтобы увидеть их — вы избежите остановки/запуска приложения.
Live-сервер
С другой стороны, то, что делает live-сервер, совершенно другое. Вы должны установить его глобально:
npm install -g live-server
затем, когда вы запустите его в каталоге, он попытается обслужить файл index.html, если он существует (в противном случае он отобразит содержимое каталога).
Оставаясь в каталоге my-app, создайте файл index.html:
touch index.html
Затем добавьте следующее содержимое:
<!DOCTYPE html>
<html lang = "en">
<head>
<meta charset = "UTF-8" />
<title>Test</title>
<style></style>
</head>
<body>
<p>Hello, World!</p>
<script></script>
</body>
</html>
Запустите live-сервер, введя live-server в окне терминала, и http://127.0.0.1:8080 должен открыться в вашем браузере.
Теперь попробуйте изменить сообщение в HTML-файле или добавить стили или JavaScript. Когда вы внесете какие-либо из этих изменений и сохраните их, браузер обновится, и вы увидите эти изменения на своей странице.
Это само по себе очень практично, но вы ничего не смогли бы сделать, обновив браузер вручную. Такой пакет становится незаменимым, когда вы делаете запрос Ajax, включаете файл без использования протокола или делаете что-либо еще, что было бы заблокировано политикой безопасности браузера, если бы вы открыли файл HTML напрямую.
Зависит от того, как создается файл HTML. Если это обычный HTML-файл на жестком диске, Nodemon не поможет. Однако, если это представление создается приложением на основе Node (например, Express), оно будет.
не могли бы вы объяснить здравый смысл для liveserver и ajax. Без liveserver не работал бы ajax? Я использую livereload, то же самое?
Привет. Спасибо за подробный ответ. Что, если в случае с nodemon я обслуживал файл HTML, в котором я изменил текст с Hello World на что-то другое. Будет ли nodemon отражать изменение?