Unable to add Sass in Angular 4
Question
I have created a blank project in angular 4 and I am trying to design it but the sass isn't working when ever I add sass and run project I am getting this error
body{
h1{
color : red;
}
}
^
Invalid CSS after "body{": expected "}", was "{"
in C:projectname/src\styles.sass (line 1, column 6)
My index.html code is
<body>
<h1>Here</h1>
</body>
Any help would be appreciated
1 answers
solution1
1 ACCPTED 2019-06-18 18:13:12
Based on your error message (C:projectname/src\\styles.sass) It seems you're using the .sass extension for a SCSS file. Change your file name to styles.scss .
Sass and SCSS use two different and incompatible syntaxes.
There are two syntaxes available for Sass. The first, known as SCSS (Sassy CSS) and used throughout this reference, is an extension of the syntax of CSS. This means that every valid CSS stylesheet is a valid SCSS file with the same meaning. This syntax is enhanced with the Sass features described below. Files using this syntax have the .scss extension.
The second and older syntax , known as the indented syntax (or sometimes just “Sass”), provides a more concise way of writing CSS. It uses indentation rather than brackets to indicate nesting of selectors, and newlines rather than semicolons to separate properties. Files using this syntax have the .sass extension.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.