Import sass file

4 file import sass

sassThe @importrule generates cssput related files into a file comes in. This means that all styles are grouped into the same cssdocument, without having to initiate additional download request.

1 sassfile local file name begins with an underscore. Thus, sassit will not this file output separately compiled at compile time css, as this document only import. When you @importwhen a local file, also can not write the full name of the file that underscore the beginning of the file name is omitted.

2 default variable values

!defaultFor variable, meaning: if this variable is declared assignment, and it values its statement, otherwise use the default values. And the css! In contrast important role

3. You can not use sassthe @importdirect import an original cssdocument, because sassthink you want to use cssnative @import. However, because sassthe syntax is fully compatible css, so you can put the original cssfile renamed the .scsssuffix, can be directly imported

4. Silent comment

body {
  color: #333; // 这种注释内容不会出现在生成的css文件中
  padding: 0; /* 这种注释内容会出现在生成的css文件中 */ }

When the comment appears in native cssplace where, as in cssproperty or selector, sasswill not know how to generate the corresponding cssappropriate position in the file, then the notes have been erased.

If you need to import or SCSS Sass file, but do not want to compile it as CSS, just add an underscore in front of the filename, it will tell Sass do not compile these files, but do not need to add the import statement underlined.

For example, name the file _colors.scss, will not compile _colours.css file.

@import "colors";

The above example, the imported file is actually _colors.scss

Note that can not coexist with the same name as the file is not underline underline, the underline files will be ignored

sass imported (@import) and CSS rules are different, compile time will come @import of scss file merge only generate a CSS file. But if you import the file sass css file as @import 'reset.css', with the effect that the general CSS styles to import files, import css files are not merged into the compiled files, but rather in a way there is @import .

All sass import file can be ignored suffix .scss. Generally based file naming method _ beginning, as _mixin.scss. This file can not be imported at the time of writing the underscore, can be written @import "mixin"

Guess you like