Comment installer LiveReload sur Sublime Text 3?

Question

J'utilise Sublime Text 3 et souhaitez utiliser LiveReload . J'ai un plugin de navigateur pour Chrome déjà installé. Node.js est également installé.

Pour Sublime Text 3 Live Reload, ce plugin doit être installé: https://github.com/dz0ny/LiveReload-sublimetext2

Comment puis-je l'installer sur Windows 7? Cela dit juste quelque chose sur les utilisateurs de Linux et OSX.

Answer 1

Plateforme que j'ai utilisée: Linux Mint 17+
Je tiens à remercier http://anthozano.fr/livereload-pour-sublime-text-3/ . J'ai pu exécuter le rechargement en direct sur le texte sublime 3 avec les instructions du site Web. Cependant, le site Web est écrit en français (je crois - Google translate a dit), donc j'ai pensé que je pourrais écrire les étapes ici.

Installez d'abord le sublime texte 3 à partir d'ici http://www.sublimetext.com/ ou suivez votre propre chemin que vous préférez (je l'ai fait avec le gestionnaire de paquets Linux mint).

Deuxièmement, installez le contrôle de package à partir d'ici https://packagecontrol.io/installation#st (les instructions sont clairement données dans le site web donc je ne l'ai pas beaucoup expliqué).

Troisièmement, ouvrez le contrôle de package (Raccourci: Ctrl+Shift+P) et recherchez Package Control: Add Repository

Vient maintenant une région pour entrer l'URL dans la partie inférieure de la fenêtre de texte sublime 3. Entrer https://raw.github.com/Grafikart/ST3-LiveReload/master/package.json.

Encore une fois, ouvrez le contrôle de package et recherchez Package Control: Install Package puis recherchez LiveReload dans la fenêtre à venir.

Configurer le paramètre du package LiveReload à Preferences > Package Settings > LiveReload > Setting - Default et collez ceci:

 
 {
 "enabled_plugins": 
 "SimpleReloadPlugin", 
 "SimpleRefresh" 
 
} 
 

Maintenant pour votre navigateur, installez le plug-in LiveReload comme ci-dessous:
Firefox : http://download.livereload.com/2.1.0/LiveReload-2.1.0.xpi
Chrome : https://chrome.google.com/webstore/detail/livereload/jnihajbhpnppcggbcgedagnkighmdlei
Safari : http://download.livereload.com/2.1.0/LiveReload-2.1.0.safariextz

N'oubliez pas d'activer le plugin LiveReload dans le navigateur une fois que vous l'avez installé, afin que vous puissiez voir les changements de code reflétés dans le navigateur tout de suite.

Remarque: Chrome, pour que LiveReload prenne en charge file:// pages, accédez à chrome://extensions/, et cochez Allow access to file URLs.

Instantané tiré de Safari pour Mac OSX:

Profitez, rechargez en direct avec Sublime Text 3.

Merci à Anthony Lozano pour http://anthozano.fr/livereload-pour-sublime-text-3/ .

Answer 2

Le plugin mentionné dans les commentaires, LiveReload , est disponible pour ST2 et ST3, comme indiqué par le graphique sur le lien Contrôle de package que je viens de fournir. Cela fonctionne également très bien sur Windows, car la majorité de ses utilisateurs sont sur cette plate-forme. Le référentiel Github peut être nommé "LiveReload-sublimetext2 ", mais si vous lisez la documentation, elle mentionne également clairement ST3. Les instructions Linux et OS X dans le fichier lisez-moi concernent l'installation à l'aide de git . Vous pouvez également utiliser git sur Windows (s'il est installé), mais l'auteur n'a apparemment pas eu envie de mettre des instructions explicites dans le fichier README. Au lieu de cela, la méthode d'installation préférée est via le contrôle de package, comme décrit ci-dessus par l'utilisateur aimable DaV. Si son commentaire disparaît, procédez comme suit:

1. Ouvrez Sublime Text 3.
2. Ouvrez la palette de commandes avec CtrlShiftP.
3. Tapez pci pour afficher Package Control: Install Package. Frappé Enter.
4. Tapez livereload et assurez-vous que le package souhaité est sélectionné. Sinon, utilisez les touches fléchées. Frappé Enter.
5. Lisez la documentation et ajoutez le JavaScript approprié à vos documents, ou téléchargez un plugin de navigateur (ce que vous semblez avoir déjà fait, donc bon pour vous).
6. Allez développer.

Answer 3

Au lieu de recharger en direct, je suggère que la synchronisation du navigateur fasse la même chose en mieux et sans avoir besoin de plugins de navigateur ennuyeux.

https://www.youtube.com/watch?v=Rv5f_v5gqw4

Answer 4

LiveReload Sublime text3 ： https://github.com/Grafikart/ST3-LiveReload

Mais l'utilisation semble avoir changé: activez les plug-ins souhaités via la palette de commandes (Ctrl + Maj + P), ajoutez livereload.js à votre document html.

Answer 5

Un long moment s'est écoulé. Maintenant, pour le texte sublime 3, le plugin LiveReload le plus à jour peut être trouvé ici .

Je rencontre ce problème lorsque j'ai essayé de configurer l'aperçu en direct des fichiers de démarque (je n'ai pas testé sur d'autres types de fichiers). Je pense que cela pourrait vous intéresser.

• Tout d'abord, vous devez installer sublimetext-markdown-preview . Suivez les instructions sur comment prévisualiser dans le navigateur .

  utilisation cmd+shift+P puis Markdown Preview pour afficher les commandes suivantes (vous serez invité à sélectionner l'analyseur que vous préférez):

  • Aperçu Markdown: Aperçu dans le navigateur

• Utilisez le contrôle du package pour installer LiveReload .

  Avec le contrôle des packages:

  Exécutez la commande "Package Control: Install Package", recherchez et installez LiveReload> plugin. Redémarrez l'éditeur ST (si nécessaire)

• Modifiez le paramètre utilisateur du plugin LiveReload sous Preferences->Package Settings->LiveReload->Setting - User, ajoutez ce qui suit:

  {"enabled_plugins": ["SimpleReloadPlugin"]}}

Vous pouvez maintenant utiliser livereload lorsque vous modifiez vos fichiers de démarque.

Comment trouver le nom exact du plugin

Le référentiel github ne sait pas comment définir le plugin dans les paramètres utilisateur, il donnez simplement une liste des plugins pris en charge sans donner leurs noms réels. Après avoir inspecté le paquet (voir l'image ci-dessous), j'ai trouvé les noms exacts de ces plugins:

1. CompassPlugin
2. LESSPlugin
3. CoffeescriptPlugin
4. SimpleReloadPlugin
5. SimpleReloadPluginDelay