# @soleil-se/build-sass

Skript för att bygga och ladda upp Sass till filarkivet i Sitevision.

## Installation

```sh
npm install @soleil-se/build-sass sass --save-dev
```

## Användning

Lägg till följande i `package.json` för att kunna starta skriptet.

**package.json**

```json
{
  "scripts": {
    "sass": "build-sass"
  }
}
```

| Kommando              | Beskrivning                                                                               |
| --------------------- | ----------------------------------------------------------------------------------------- |
| `npm run sass watch`  | Starta övervakning av filer för att kompilera och ladda upp.                              |
| `npm run sass start`  | Kompilerar alla filer en gång och laddar upp dessa, startar sedan övervakning av filerna. |
| `npm run sass build`  | Kompilerar alla filer utan att ladda upp.                                                 |
| `npm run sass deploy` | Kompilerar och laddar upp alla filer.                                                     |
| `npm run sass`        | (DEPRECATED) Samma som deploy.                                                            |

## Argument

Följande argrument är tillgängliga

* `--no-sync` - Stänger av uppladdning till Sitevision.
* `--debug` - Stänger av minifiering för enklare felsökning.
* `--css-prefix {value}` - Prefix för ihopbyggda filer.
* `--input` - Anger vilken (sökväg) eller vilka (glob) filer som ska användas som utgångspunkt, ex `npm run sass -- --input ./foo/bar/main.scss`
* `--watch` - (DEPRECATED) Startar övervakning av filer.

## Inställningar

Skriptet använder följande inställningar:

* [Miljö](/build/config/#milj%C3%B6)
* [Browserslist](/build/config/#browserslist)
* [PostCSS](/build/config/#postcss)

### Input

Array eller glob som specificerar vilka filer som ska byggas, standardvärdet är `["./client_src/sass/main.scss"]`.

**project\_config.json**

```json
{
  "css": {
    "input": ["./sass/main.scss", "./sass/vendor.scss"]
  }
}
```

### Files (DEPRECATED)

Legacyinställning.\
Array som specificerar vilka filer som ska byggas om standardstrukturen (`./client_src/sass`) används, standardvärdet är `["main"]`.

**project\_config.json**

```json
{
  "css": {
    "files": ["main", "vendor"]
  }
}
```

### Prefix

Man kan lägga på en prefix på filerna som byggs för att undvika krockar eller för att felsöka. Lättast är att använda `css-prefix` argumentet när man startar skriptet.

Om man till exempel lägger på argumentet `--css-prefix=foo` så kommer en fil med namnet `foo.main.css` byggas.

Om inställning för prefix behöver vara mer permanent kan den läggas till i CSS inställningar eller i inställningarna för en specifik miljö.\
Den kan sättas i både `project_config.json` eller `user_config.json`.

**project\_config.json**

```json
{
 "env": {
    "development": {
      "cssPrefix": "foo"
    }
 },
 "css": {
    "prefix": "foo"
  }
}
```