communauté Apprendre Bibliothèque d'outils Loisirs
recherche
Français
Maison > outils de développement > VSCode > Comment compiler Sass avec vscode

Comment compiler Sass avec vscode

尚
Libérer： 2019-12-31 14:38:53
original
3714 Les gens l'ont consulté

Comment compiler Sass avec vscode

Utilisez vscode pour compiler sass

La première étape consiste à installer easy sass dans vscode. L'image ci-dessous montre l'état d'installation réussie

Comment compiler Sass avec vscode

La deuxième étape, modifiez la configuration de vscode 

"easysass.compileAfterSave": true, 
 "easysass.formats": [ //nested：嵌套缩进的 css 代码。
//expanded：没有缩进的、扩展的css代码。
//compact：简洁格式的 css 代码。
//compressed：压缩后的 css 代码

        {
            "format": "expanded",
            "extension": ".css"
        },
        {
            "format": "compressed",
            "extension": ".min.css"
        }
    ],
    "easysass.targetDir": "css/" //路径
Copier après la connexion

La troisième étape, créez un nouveau dossier, créez deux nouveaux dossiers dans le dossier, un sass et un css, si vous ne l'avez pas fait dossier css créé, un dossier

Comment compiler Sass avec vscode

sera automatiquement créé après la compilation Étape 4, puis créez demo.sass sous sass, puis écrivez

Cinq étapes. , appuyez sur ctrl + s pour compiler directement. Parce que vous avez défini easysass.compileAfterSave sur true lors de la configuration précédente, il sera donc compilé une fois après l'enregistrement. C'est également pour améliorer l'efficacité du développement

Enfin, j'ai trouvé cela. il y a un fichier css supplémentaire sous le css, un fichier min.css Ceci est lié aux paramètres que vous avez définis, un sans indentation et un compressé

Comment compiler Sass avec vscode

Cet article arrive. de la colonne

tutoriel vscode du site Web PHP chinois.

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!

Étiquettes associées：
sass vscode
source：php.cn
Article précédent：Comment déboguer et exécuter des programmes C# avec vscode Article suivant：La touche de tabulation échoue dans vscode
Déclaration de ce site Web
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
Derniers articles par auteur
Derniers numéros
La page ne peut soudainement plus extraire le CSS ou le bootstrap Je suis donc en train de développer une page, j'en ai fait une partie hier et ça a très bi...
Depuis 2024-04-06 21:58:04
0
1
800
Le vérificateur de Sudoku ne fonctionne pas ? Quelqu'un peut-il m'aider à identifier l'erreur ? J'ai tout essayé sur l'éditeur en ligne mais j'obtiens toujours l'erreur. Mais quand je fa...
Depuis 2024-04-06 21:21:07
0
1
474
Ma page a un titre en HTML, mais il n'est pas visible Alors je viens de commencer à coder alors ne me jugez pas. J'essaie de créer mon site Web ...
Depuis 2024-04-01 18:24:53
0
1
364
Comment personnaliser l'attribut d'identifiant VSCode ? Je suis récemment passé d'Atom à VSCode, et même si j'ai réussi à personnaliser la plupart...
Depuis 2024-03-31 14:13:45
0
1
373
/bin/sh : 1 : C:xamppphpphp.exe : introuvable J'utilise WSL2, Ubuntu20.04 et j'exécute VSCode. J'utilise l'extension CodeRunner dans VSC...
Depuis 2024-03-31 09:10:37
0
1
333
Rubriques connexes
Plus>
Recommandations populaires
Tutoriels populaires
Plus>
Tutoriels associés
Recommandations populaires
Derniers cours
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal