Configuration de l'outil de développement frontal sublime text3
Mon front-end white est un débutant en front-end, j'ai appris grâce à certains blogueurs que l'outil de développement de sublime text 3 est très convivial pour les débutants front-end, je l'ai donc choisi. Cependant, en raison du fait que le site officiel se trouve à l'étranger et pour d'autres raisons, le réseau n'est souvent pas fluide, il est très difficile à configurer et il ne fait pas semblant. Je pensais que cela pouvait être fait en 20 minutes, mais il a fallu beaucoup de mal pour bien faire les choses. Afin de faciliter votre future configuration, j'ai également intégré les tutoriels des dieux majeurs sur Baidu, ici je vais partager avec vous mon processus de configuration complet.
- Téléchargez
sublime site officiel sublime,
choisissez simplement votre propre version du système. - L'installation de sublime est
gratuite, vous pouvez l'installer où vous le souhaitez, veuillez noter que le chemin ne peut pas contenir le nom chinois. - Utilisation simple du sublime
-Nouveau fichier HTML: ctrl + N
-Écrire rapidement du code HTML:! + Touche Tab (à condition qu'il y ait un plug-in emmet, cela sera décrit en détail ci-dessous) -Créer
un projet: cliquer sur le projet, ajouter le dossier où se trouve le projet pour sublimer
-enregistrer le fichier: crtl + S - Plug-ins couramment utilisés dans Sublime (les plus couramment utilisés que je connais):
Il existe deux façons d'installer des plug-ins sublimes (nous utiliserons les deux):
-La première consiste à installer directement, d'abord télécharger le package d'installation du plug-in , puis installez-le Décompressez-le dans le dossier du package sous le répertoire d'installation de sublime ; le
second est également couramment utilisé - installez les plug-ins via le contrôle de package:
- Tout d'abord, installez Package Control: après avoir ouvert sublime et entré dans la page principale, appuyez sur Ctrl + Shift + P pour appeler Hors de la carte de commande, entrez: PC , cochez la case d'invite ci-dessous, s'il y a des invites telles que Package Control: xxxx xxxx, sinon, il n'est pas installé. Vous devez sélectionner installer Package Control dans la boîte de dialogue pour installer. Après avoir cliqué, regardez attentivement dans le coin inférieur gauche, il y aura une simple animation de "[=]" se déplaçant à gauche et à droite, indiquant que Package Control est en cours de téléchargement et d'installation en ligne. Il convient de noter que le réseau sera très lent pendant le processus de téléchargement et que l'installation peut échouer. Répétez simplement les étapes ci-dessus. Une fois l'installation réussie, il y aura une page entièrement en anglais.
- Une fois l'installation de Package Control terminée, vous pouvez commencer à installer le plug-in. Étapes:
1. Appelez la carte de commande et entrez install, sélectionnez Package Control: install package et attendez que le répertoire du plugin se charge. Ce processus est parfois plus lent, principalement à cause du réseau. Certaines solutions ont été trouvées sur Baidu, et la mesure réelle est efficace.
"channels":
[
"http://cst.stu.126.net/u/json/cms/channel_v3.json"
],
Copiez le code ci-dessus et collez-le dans les accolades dans les préférences-> Paramètres du package-> Paramètres-Utilisateur. L'emplacement collé est probablement le suivant. Le "paquet_installé" contient les plug-ins installés. S'il est nouvellement installé, il devrait être vide, peu importe.
Après avoir terminé, l'ouverture de la liste des plug-ins sera un peu plus rapide haha.
2. Après avoir ouvert la liste des plug-ins, entrez le nom du plug-in, sélectionnez le plug-in et appuyez sur Entrée. Une fois le chargement terminé, l'installation du plug-in peut être terminée.
Cependant, les idéaux sont beaux et la réalité est cruelle. Vous constaterez que l'installation réseau échoue quel que soit le nombre de tentatives.
Je recommande quelques plug-ins que je pense nécessaires:
1. ChineseLocalization: plug-in chinois
2. ConvertToUTF8: convertit automatiquement l'encodage de fichier en UTF-8
3. Emmet: écrivez rapidement des plug-ins de balisage HTML et CSS (c'est le âme sublime Où est - il Recommandation: hautement recommandé)
4. IMESupport: la position de la méthode d'entrée suit le curseur se déplace
5. SublimeCodeIntel: indicateurs de code
6. SidebarENhancements: Faire les fonctions de la barre latérale plus abondante
les différents plugins que je recommande ci - dessus, comment en installer quelques-uns Je ne peux pas l'adapter, haha. Nous ne pouvons donc pas l'installer via Package Control, nous devons utiliser la méthode d'installation directe.Après le téléchargement, décompressez-le directement dans le répertoire du package et redémarrez sublime.
Les ressources sur Internet sont dispersées et les tutoriels sont quelque peu différents, en particulier pour le plug-in Emmet. Après avoir installé le plug-in Emmet, un autre plug-in Pyv8 est nécessaire, mais ce plug-in n'est souvent pas installé par lui-même. Vous devez l'installer manuellement. Ce que je peux tester par moi-même est de mettre Pyv8 dans les packages installés , comme illustré dans la figure ci-dessous. et! N'oubliez pas de ne pas copier une copie dans les packages. Bien que le plug-in Pyv8 soit chargé avec succès au démarrage, Tab ne peut pas être utilisé comme touche de raccourci. Je ne connais pas la raison spécifique, mais je le lance depuis longtemps temps.
Enfin, il y a aussi la suppression du plug-in: ouvrez la carte de commande, entrez Package Control: Remove Package, sélectionnez Enter, et la page du plug-in que vous avez installé s'ouvrira.
Sublime Text 3 est un logiciel payant. Vous constaterez qu'après avoir appuyé plusieurs fois sur ctrl + s pour enregistrer le fichier, une fenêtre apparaîtra vous demandant de l'acheter. De nombreux codes d'activation sur Internet ont expiré. Il a fallu beaucoup d'efforts pour en trouver un et le mettre dans le lien ci-dessous.
J'utilise personnellement Win10 64 bits sublime, j'ai intégré les fichiers, si vous avez un petit partenaire dans le besoin, vous pouvez le télécharger via Baidu Cloud.
Lien: https://pan.baidu.com/s/1ZHaGb0EyQw4XaDikI0o_NQ
Code d'extraction: insz
Ce partage est destiné à l'apprentissage uniquement, veuillez ne pas l'utiliser à des fins commerciales.
Si vous avez de meilleures recommandations de plug-ins ou si j'ai des erreurs, n'hésitez pas à échanger et à apprendre!