Installation
How to add sds-core to a project.
To facilitate sds-core
inclusion into projects, you need to access the library, which can be found as an NPM package or can be used locally by downloading it from the GitHub repository.
We recommend using sds-core
through its NPM package.
How to add and use sds-core
into a JavaScript project
sds-core
into a JavaScript project1. Add sds-core
as a dependency to the project by using the following command in the terminal.
2. Once added, there are two primary files to use inside the sds-core
package: sds-reset.scss
and sds-tools.scss
.
sds-reset.scss
contains all the reset styles, and sds-tools.scss
once has all the functions and mixins. We strongly recommend adding the sds-reset.scss
only one time into the main file of hte project in order to apply the general styels reset.
If these two files are used properly, there should not be any duplicated styles.
3. In order to have access to all the functions and mixins of Sipster-Core, you must import the sds-tools.scss
file at the beginning of all the SCSS files where these tools are going to be used, like in the following example:
Why would you use @import
into SCSS files instead of @use
?
@import
into SCSS files instead of @use
?This is a very good and valid question. As some developers may have noticed, official SASS documentation now recommends using @use
instead of @import
.
Then, why do we keep using @import
? At the time of this writing, most 2600Hz projects use node-sass packages, which is not yet compatible with the new @use
command. @use
is only compatible with the latest SASS package versions, which are not yet very common and could create compatibility issues. So, for the time being, keep using @import
as it is the standard in 2600Hz projects and will not be deprecated any time soon.
Last updated