Qu'est-ce qui provoquerait un fichier sass à interrompre la compilation en raison d'un saut de ligne?

J'ai un fichier SASS: sitemap.scssQu'est-ce qui provoquerait un fichier sass à interrompre la compilation en raison d'un saut de ligne?

Il ne contient que les éléments suivants (pour l'instant):

.hero { 
    height: 600px; 
    background: none; 
}

J'utilise gulp-SASS qui a, jusqu'à présent, compilé mon SASS parfaitement bien.

L'erreur de sortie lors de la compilation de ce fichier se lit comme tel:

Error in plugin 'gulp-sass' 
Message: 
    assets/styles/source/components/sub-pages/sitemap.scss 
Error: Invalid CSS after ".hero {": expected "}", was "{" 
     on line 1 of assets/styles/source/components/sub-pages/sitemap.scss 
>> .hero { { 
    -------^ 

Details: 
    formatted: Error: Invalid CSS after ".hero {": expected "}", was "{" 
     on line 1 of assets/styles/source/components/sub-pages/sitemap.scss 
>> .hero { { 
    -------^ 

    column: 8 
    line: 1 
    file: /Users/dvasquez/Sites/workspace/Development/branch3/site.com/assets/styles/source/components/sub-pages/sitemap.scss 
    status: 1 
    messageFormatted: assets/styles/source/components/sub-pages/sitemap.scss 
Error: Invalid CSS after ".hero {": expected "}", was "{" 
     on line 1 of assets/styles/source/components/sub-pages/sitemap.scss 
>> .hero { { 
    -------^ 

    messageOriginal: Invalid CSS after ".hero {": expected "}", was "{" 
    relativePath: assets/styles/source/components/sub-pages/sitemap.scss

Maintenant, voici là que ça devient bizarre. Si je prends ce même fichier sass, et l'écris comme ceci:

.hero { height: 600px; background: none; }

Il se compile très bien. J'ai supposé que cela pouvait être un problème d'encodage, alors j'ai supprimé le fichier et j'en ai créé un nouveau. Même problème. Quelqu'un at-il déjà rencontré quelque chose comme ça avant? J'ai beaucoup d'autres fichiers sass dans mon projet et aucun d'entre eux ne présente ce comportement.

En plus de cela, j'ai également essayé d'importer un partiel qui incluait la version 4-lignes du fichier et qui fonctionnait très bien aussi.

Toutes les idées seraient grandement appréciées.

Source

2016-06-25 David Vasquez

Avez-vous essayé de supprimer la ligne et de la taper à nouveau (pas de couper/coller style)? Les messages d'erreur semblent indiquer qu'il y a deux '{' dans la ligne. Vous pouvez utiliser un éditeur hexadécimal pour vérifier les caractères inhabituels. – kicken

On dirait que vous compilez SASS indenté et pas SCSS. SASS n'utilise pas de parenthèses, mais utilise plutôt des retraits, donc lorsque vous incluez les parenthèses, il ajoute un second crochet et lance l'erreur. Lorsque vous le mettez sur une ligne, il est reconnu comme CSS standard. Vérifiez vos paramètres de gorgée et voyez si vous avez indenté sass mis à vrai. – rachel

Kicken, je suis allé jusqu'à supprimer le fichier entier, mais oui, j'ai testé en supprimant la ligne et en la réécrivant. Même erreur Rachel, merci pour la suggestion, mais j'imagine que si elle compilait le SASS indenté alors tous mes autres fichiers scss échoueraient massivement. Tout le reste compile bien (nous parlons de 50 à 100 autres fichiers scss avec des centaines de lignes de code). Je vais essayer votre suggestion lundi, cependant, au cas où. C'est vraiment déconcertant. Je n'ai jamais connu ce type de problème auparavant. –

Comme mentionné dans @rachel's comment ci-dessus, essayez de définir indentedSyntax: false dans votre configuration de gulp-sass. J'ai eu exactement les mêmes erreurs et cela a fonctionné pour moi!

"sass": { 
    "indentedSyntax": false, //Set to false to allow standard SCSS syntax using braces. 
    "includePaths": [ 
    "./node_modules/normalize.css" 
    ] 
}

Source

2016-09-29 16:25:22

Qu'est-ce qui provoquerait un fichier sass à interrompre la compilation en raison d'un saut de ligne?

Répondre

Questions connexes