Index files for folder imports in SASS - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is the purpose of an index file in folder imports in Sass?

An index file in Sass acts like a central place that gathers and re-exports all the styles from files inside a folder. This makes importing easier and cleaner by importing just the folder instead of each file separately.

beginner

How do you name an index file in a Sass folder for automatic folder import?

You name the index file as <code>_index.scss</code>. Sass treats this file as the main entry point when you import the folder.

beginner

What is the benefit of using index files for folder imports in Sass projects?

Using index files helps keep import statements short and organized. It reduces repetition and makes it easier to manage many Sass files by grouping them logically.

beginner

How do you import a folder with an index file in Sass?

You simply import the folder name without specifying any file. Sass automatically looks for the <code>_index.scss</code> file inside that folder and imports it.

intermediate

Can you have multiple index files in different folders in a Sass project?

Yes, each folder can have its own _index.scss file. This allows each folder to control what styles it exports when imported.

What filename does Sass look for when importing a folder?

A index.scss

B main.scss

C _main.scss

D _index.scss

Sass looks for the file named _index.scss inside the folder when you import the folder.

Why use an index file for folder imports in Sass?

A To avoid using variables

B To speed up compilation

C To combine multiple files into one import

D To write CSS faster

Index files let you combine many Sass files inside a folder so you can import them all at once by importing the folder.

How do you import a folder named 'components' with an index file?

A @import 'components';

B @import 'components/_index.scss';

C @import 'components/index.scss';

D @import 'components/*';

You just import the folder name. Sass automatically finds the _index.scss file inside.

Can you have multiple index files in a Sass project?

A Yes, one per folder

B No, only one per project

C Only if they have different names

D Only in the root folder

Each folder can have its own _index.scss file to control its exports.

What happens if a folder has no _index.scss file and you import it?

A Sass imports all files automatically

B Sass throws an error

C Nothing is imported

D Sass imports the first file alphabetically

If there is no _index.scss file, Sass cannot import the folder and will throw an error.

Explain how index files simplify folder imports in Sass and how to use them.

Think about how you gather many small files into one main file for easier importing.

Describe the benefits of organizing Sass files with index files in multiple folders.

Consider how grouping related styles helps manage large projects.