Maison  >  Article  >  outils de développement  >  Comment configurer webstorm pour compiler sass ? (processus détaillé)

Comment configurer webstorm pour compiler sass ? (processus détaillé)

不言
不言original
2018-09-26 16:24:545655parcourir

Le contenu de cet article explique comment configurer et compiler Sass dans Webstorm ? (Processus détaillé) a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer. J'espère que cela vous sera utile.

1. Téléchargez Ruby (sélectionnez le fichier dans RubyInstallers) et installez-le. Pendant l'installation, activez √ les trois cases à cocher. Après une installation réussie, vérifiez les informations de version :

ruby -v
gem -v

2. Installez sass

J'ai oublié comment l'installer, gem install sass est écrit en ligne Ça y est, je ne sais pas si c'est vrai. Installez Sass. Après l'installation, entrez sass -v sur la ligne de commande pour vérifier s'il faut publier le numéro de version. Ensuite, les fichiers suivants apparaîtront dans le chemin d'installation (C:Ruby23bin)

3 Ajouter la configuration SCSS dans Webstorm

Fichier → Paramètres→ Outils→ Fichier. Le "+" vert dans la colonne de droite des Watchers sélectionne SCSS

Nom : Le nom peut être modifié par vous-même

Programme : configurez automatiquement l'emplacement du chemin, vous n'avez pas besoin de le remplir, vous pouvez également le modifier manuellement

Arguments : no-cache --update --sourcemap --watch $FileName$ : $FileNameWithoutExtension$.css

Chemins de sortie à actualiser : $FileNameWithoutExtension$.css:$FileNameWithoutExtension$.css.map

Après le réglage, cliquez sur "OK",

Quand vous revenez à la colonne de droite de File Watchers, un Compass SCSS sera ajouté. Sélectionnez-le (case à cocher √ ci-dessus) et cliquez sur Appliquer dans le coin inférieur droit. Une fois l'ajout réussi, créez le fichier SCSS. Après avoir écrit, le CSS et la carte. les fichiers sont générés automatiquement, ce qui signifie le succès

Remarque :

1 La compilation synchrone ne peut être effectuée que dans le dossier du projet actuel, qui est le projet ouvert. sur le côté gauche de webstorm. L'ouverture d'un fichier en dehors du projet ne fonctionnera pas.
2. Autrement dit, sass ne peut pas être compilé avec des caractères chinois, quel que soit le nom du chemin, le nom du fichier ou le contenu du fichier. les caractères ne peuvent pas être reconnus

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn