https://github.com/evavic44/dart-sass-setup
An updated method for running SASS in a project
https://github.com/evavic44/dart-sass-setup
Last synced: 6 months ago
JSON representation
An updated method for running SASS in a project
- Host: GitHub
- URL: https://github.com/evavic44/dart-sass-setup
- Owner: Evavic44
- Created: 2021-12-27T04:15:37.000Z (almost 4 years ago)
- Default Branch: main
- Last Pushed: 2021-12-27T04:58:52.000Z (almost 4 years ago)
- Last Synced: 2024-10-06T04:01:21.535Z (about 1 year ago)
- Language: SCSS
- Size: 3.91 KB
- Stars: 1
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
Install and set up SASS in a project with Dart Sass
A new and improved way of installing and setting up SASS in your project. Recent release 2021: version 1.45
## Installation of Dart SASS using NPM
Read the following steps on how to install Dart SASS using NodeJS.
### Install SASS globally.
The first step is to install SASS globally.
```js
npm install -g sass
```
_If you run into any errors, try adding **sudo** as a prefix._
```js
sudo npm install -g sass
```
### Create our directories
Next step is to create our SCSS and CSS folders.
You can do that in the command line or just create the folders natively in your PC.
To do that in the command line, type the following.
This will create our SCSS folder
```js
mkdir scss
```
And this will create our CSS folder
```js
mkdir css
```
### Watch SASS
Now we have created our directories, we need to activate the watch flag to watch the SCSS folder and compile any changes to CSS.
```js
sass --watch scss:css
```
Here we are watching a folder called SCSS which compiles every changes to a folder called CSS. You can customize this directory according to what your project works with.
E.g
```js
sass --watch scss:dist/css
```
Which is targeting the CSS file inside the dist folder.
Finally, we have successfully gotten SASS up and running in our projects.
You can turn off the the `main.css.map` inside the `package.json` settings.
## Installation of Dart SASS locally
You can also install Dart SASS into your machine by downloading one of their packages and adding it to a path folder in your machine.
You can read more on how to do that here
Available for Windows, Mac and Linux.
## Why Dart SASS?
Dart Sass has replaced Ruby Sass as the canonical implementation of the Sass language. We chose Dart because it presented a number of advantages. Read more
## Important links