ng serve ne détecte pas automatiquement les modifications de fichiers

Je dois exécuter à ng servechaque fois que des modifications sont apportées aux fichiers source.Je n'ai aucune erreur dans la console.

Angular CLI: 1.6.2
Node: 8.9.1
OS: linux ia32
Angular: 5.1.2
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

@angular/cdk: 5.0.2-c3d7cd9
@angular/cli: 1.6.2
@angular/material: 5.0.3-e20d8f0
@angular-devkit/build-optimizer: 0.0.36
@angular-devkit/core: 0.0.22
@angular-devkit/schematics: 0.0.42
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.9.2
@schematics/angular: 0.1.11
@schematics/schematics: 0.0.11
typescript: 2.4.2
webpack: 3.10.0

La plupart du temps sous Linux, ng serveou ng build --watchne fonctionne pas si le répertoire ne dispose pas des autorisations suffisantes.

La solution consiste soit à fournir les autorisations nécessaires, soit à utiliser à la sudoplace.

METTRE À JOUR

watch flag in ng serveest en fait redondant car c'est l'option par défaut. Merci à @Zaphoid d'avoir signalé l'erreur.

ng serve --poll=2000

Fonctionne bien sous Linux et Windows

Considérez que, lorsque vous avez un grand nombre de fichiers, il existe une limite chez INotify Watches sous Linux. Ainsi, augmenter la limite des montres à 512K, par exemple, peut résoudre ce problème.

sudo sysctl fs.inotify.max_user_watches=524288
sudo sysctl -p --system

Notez que le précédent entraîne une modification en mémoire que vous perdrez après le redémarrage.

Cependant, vous pouvez le rendre persistant , en exécutant:

echo fs.inotify.max_user_watches=524288 | sudo tee /etc/sysctl.d/40-max-user-watches.conf && sudo sysctl --system

A titre de référence, vous pouvez vérifier: https://github.com/angular/angular-cli/issues/8313#issuecomment-362728855 et https://github.com/guard/listen/wiki/Increasing-the-amount- observateurs-inotify

En raison de, le système qui détecte les modifications ne peut pas gérer autant de montres par défaut.

Et la solution est de change the amount of watchespouvoir gérer (le nombre maximum de fichiers qui seront dans le projet), vous devez run this command:

echo 65536 | sudo tee -a /proc/sys/fs/inotify/max_user_watches

Le problème avec inotify est la réinitialisation de ce compteur chaque fois que vous redémarrez votre ordinateur.

Dans votre projet, le dossier dist est propre à la racine

Essayez d'utiliser à la sudo ng serveplace de ng serve.

Une autre solution

Quand il y a un grand nombre de fichiers, la montre ne fonctionne pas sous Linux, il y a une limite chez INotify Watches sur Linux. Donc augmenter la limite de montres

//When live server not work in linux

sudo sysctl fs.inotify.max_user_watches=524288
sudo sysctl -p --system

ng serve //You can also do sudo **ng serve**

Il suffit d'exécuter sudo ng serve pour résoudre le problème.

Cela peut aider si c'est le même problème que j'ai eu. Essayer d'utiliser ng serveet ng build --watchparfois travaillé, mais la plupart du temps, ils ne surveillaient pas les changements de code et je pensais que c'était quelque chose à voir avec ng.

Puis je me suis souvenu d'un problème que j'avais eu il y a quelque temps avec les montres inotify

J'ai exécuté ceci sur ma machine Ubuntu et il semble avoir démarré et regarder les changements de code:

echo fs.inotify.max_user_watches = 524288 | sudo tee /etc/sysctl.d/40-max-user-watches.conf && sudo sysctl --system

le mérite revient à Scott Smith

essaye ça. Si vous faites comme ça, vous n'avez pas besoin de toujours tirer une commande Vous n'avez besoin de tirer qu'une seule fois

echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p

cat /proc/sys/fs/inotify/max_user_watches

fs.inotify.max_user_watches=524288

Cela n'a pas fonctionné pour moi:

ng serve --watch

Essayez:

sudo ng serve

cela a fonctionné pour moi!

Si tout le reste échoue, vérifiez votre code pour les erreurs de syntaxe, en particulier sur index.htmlou sur des parties de votre code que vous avez récemment modifiées juste avant que cette mise à jour automatique ne soit interrompue. Les erreurs de syntaxe casseront cette fonctionnalité de mise à jour automatique dans Angular.

Dans mon cas, j'avais plusieurs projets ouverts dans des fenêtres VS Code séparées. Sur tous mes autres projets, a ng servefonctionné comme prévu: il est mis à jour automatiquement lors de l'enregistrement. Mais sur un projet, il faudrait une actualisation manuelle pour mettre à jour. Cela a fini par être parce que j'avais des commentaires html en dehors de la zone HTML définie du modèle (donc, les commentaires HTML sont venus avant <!doctype html>. Donc c'était invalide bc c'est la syntaxe HTML en dehors d'une zone HTML.

J'ai effacé les commentaires et bam, la mise à jour automatique a recommencé à fonctionner (après un autre rafraîchissement manuel).

Alors parcourez index.htmlou d'autres parties de votre code que vous avez récemment modifiées avant que cela ne soit cassé et une par une, découpez les parties fragmentaires, faites une actualisation dans le navigateur, puis revenez à VS Code et apportez une modification, enregistrez et voyez si elle se met à jour automatiquement .

J'ai découvert que le dossier dist / dans le projet appartenait à root. C'est pourquoi sudo ng servevoit les changements quand ng servene le fait pas.

J'ai supprimé le dossier dist / sudo rm -R dist/et le reconstruire en tant qu'utilisateur actuel en démarrant le serveur de développement ng serveet tout a fonctionné à nouveau.

J'avais ce problème sur une nouvelle installation Linux Ubuntu et j'ai remarqué que j'obtenais une erreur concernant `` trop d'observateurs pour la limite '' dans VSCode en même temps. J'ai suivi les instructions pour le réparer dans VSCode et cela a également résolu le problème avec ng watch. Plus d'informations ici https://code.visualstudio.com/docs/setup/linux#_visual-studio-code-is-unable-to-watch-for-file-changes-in-this-large-workspace-error-enospc

J'ai remarqué des gens qui suggéraient sudode faire la montre. C'est un jeu dangereux, vous donnez aux packages npm un accès root à votre système. Si vos autorisations sont correctes, mon problème pourrait être votre solution puisque la limite est par utilisateur, et en exécutant en tant que sudo, vous exécutez en tant que root au lieu de votre utilisateur actuel qui est au-delà de la limite (exécutez une montre lourde ide comme vscode ou atom sur ). Si, pour une raison quelconque, vous avez les mauvaises autorisations, définissez-les correctement sur votre utilisateur / groupe avec chown.

J'ai eu le même problème, l'utilisation sudo ng servesemblait "résoudre" le problème de manière insatisfaisante. L'utilisation sudon'est pas satisfaisante IMO.

J'ai vérifié mon compte INotify par rapport à ma limite par défaut (8192) en utilisant: lsof | grep inotify | wc -l La valeur renvoyée par la commande ci-dessus était bien inférieure à la limite. La solution INotify ne semblait donc pas s'appliquer à mon problème.

J'ai également vérifié les autorisations et la propriété, les deux semblaient ok, comparables à un autre projet qui a fonctionné.

Par frustration, j'ai redémarré VS Code. Fondamentalement, j'ai fermé toutes les instances, j'ai eu deux en cours d'exécution et les deux ont rouvert après quoi le problème a disparu.

Je me penche vers un bug possible quelque part. Ceci est quelque chose à considérer avant de transformer votre système à l'envers. Heureusement / Malheureusement, ce problème ne s'est pas reproduit, je vais creuser plus profondément si c'est le cas.

Vous pouvez essayer ceci aussi.

sudo ng serve

Je ne recommande pas de modifier les paramètres SO. J'ai rencontré des problèmes (de décalage) après avoir modifié le paramètre fs.inotify.max_user_watches car vous aurez d'autres services en cours d'exécution ...

Le "ng serve --poll = 2000" est une bonne solution mais vous oublierez probablement ce paramètre ...

Enquête: https://github.com/angular/angular-cli/wiki/angular-cli J'avais fait la solution suivante.

Changement de angular.json avec le paramètre poll

"serve": {
   "builder....
   "options": {
        "browserTarget": "xkcd:build",
        "poll": 2000
   }
   ...

Fonctionne sur ma machine: D

Faire la sudo ng servecommande est une mauvaise pratique. Vous devez modifier l' npmautorisation de sorte qu'à chaque fois, si vous devez en installer, npm packagesvous n'ayez pas à les utiliser sudo.

Ce lien peut résoudre comment modifier l'autorisation npm pour l'utilisateur actuel et après avoir suivi ces étapes après avoir défini l'autorisation npm, vous pouvez supprimer le node_modulesdossier de votre répertoire de projet et utilisernpm install . Une fois l'installation des packages terminée, vous pouvez exécuter ng serveet vous n'avez pas à le faire à sudo ng servechaque fois que vous souhaitez exécuter votre projet angulaire.

pour fenêtre -

c:\>ng serve --open

Pour Linux -

$sudo ng serve --open

Ma réponse peut ne pas être utile. mais je recherche cette question à cause de cela.

Après avoir acheté un nouvel ordinateur, j'oublie de définir la sauvegarde automatique dans l'éditeur. Par conséquent, le code reste inchangé.

Je voudrais laisser mon cas ici, juste pour référence. Dans mon cas, le problème concernait les autorisations système. J'ai utilisé un dossier partagé dans une machine virtuelle comme dépôt. Je n'avais aucun autre message comme l'autorisation refusée ou quelque chose comme ça. J'ai tout essayé, puis j'ai réalisé que j'utilisais un lecteur réseau.

Le redémarrage du serveur a fonctionné pour moi.

Donner l'autorisation complète pour le dossier du projet a fonctionné pour moi

Dans mon cas sur Mac, cela a été corrigé en accordant une autorisation de lecture / écriture à l'utilisateur connecté à / usr / local / lib