В чем разница между nodemon и live-сервером? - PullRequest
0 голосов
/ 27 января 2019

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

1 Ответ

0 голосов
/ 28 января 2019

Они служат двум различным целям.

Nodemon перезапустит приложение Node , когда будут обнаружены изменения файла в каталоге.

С другой стороны, Live-сервер обновит ваш браузер при обнаружении изменений в любых поддерживаемых типах файлов (например, HTML, JS, CSS).Он также включает запросы Ajax, когда вы работаете локально - они обычно не работают с протоколом file://.


Nodemon

Чтобы увидеть это вТеперь давайте создадим простой 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.log("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 для автоматизации этого шага ручной остановки и перезапуска приложения.

Установите его как зависимость dev:

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-файл напрямую.

...