Why put in front of the file name "_" or "_" in scss/css?
A sass file starting with an underscore is a partial. It is a good way to keep your styles separated into logical sections. These files all get merged on compilation when you use @import
.
From the Sass language guide:
You can create partial Sass files that contain little snippets of CSS that you can include in other Sass files. This is a great way to modularize your CSS and help keep things easier to maintain. A partial is simply a Sass file named with a leading underscore. You might name it something like _partial.scss. The underscore lets Sass know that the file is only a partial file and that it should not be generated into a CSS file. Sass partials are used with the @import directive.
http://sass-lang.com/guide
The _ (underscore) is a partial for scss. That means the stylesheet its going to be imported (@import) to a main stylesheet i.e. styles.scss. The advantage on using partials is that you can use many files to organize your code and everything will be compiled on a single file.
When you include "_" in front of the file name, it won't be generated into CSS unless you import it into another sass files which is not partial.
suppose your folder structure is like this
/scss
style.scss
_list.scss
/css
if you run the command
sass --watch scss:css
only style.css and style.css.map files will be created, sass compiler will omit _list.scss without converting its content into a CSS file.
/scss
style.scss
_list.scss
/css
style.css
style.css.map
the only way that you can use partials is to import them into another .scss file with
@import 'list.scss';
if you remove the '_' in front of _list.scss the outcome of the command will be
/scss
style.scss
list.scss
/css
style.css
style.css.map
list.css
list.css.map
The main purpose of using partials is to break down our CSS code into several pieces which are easier to maintain. Hope this helps. Thanks.