# Konfiguration

Skripten använder filerna `project_config.json` och `user_config.json` för bland annat miljöinställningar.\
Närmsta filerna som hittas uppåt i strukturen används.

Alla inställningar går att ange i antingen `project_config.json` eller `user_config.json` då dessa slås ihop.\
De värden som anges i `user_config.json` kommer att väga mer än värdena i `project_config.json`.

## Skapa konfiguration

Kan man använda [@soleil-se/create-build-config](/build/create-build-config) för att skapa upp konfigurationsfiler.

```sh
npm init @soleil-se/build-config@latest
```

## Miljö

> **Används av**
>
> `@soleil-se/build-app`\
> `@soleil-se/build-sass`\
> `@soleil-se/build-js`\
> `@soleil-se/build-snippets`

### Project config

Följande inställningar anges vanligtvis i `project_config.json`.

* `default` - Ange vilken miljö som ska användas som default. Här ska man **inte** ange en produktionsmiljö, när man bygger mot produktion skickas detta med i `--env` argumentet.

* `key` - Nyckel för ett objekt med miljöinställningar.

  * `name` - Namn på huset i Sitevision.
  * `host` - Adress till webbplatsen.
  * `production` - Om miljön är en produktionsmiljö eller inte.
  * `sign` - Om appar alltid ska signeras vare sig man är i en utvecklings- eller produktionsmiljö.
  * `acceptUnauthorizedCert` - Om ogiltliga SSL certifikat ska accepteras vid uppladdning.
  * `webdavRoot` - Rotkatalog i filarkivet, standardvärde är “System”.

**project\_config.json**

```json
{
  "env": {
    "default": "development",
    "development": {
      "name": "Husets namn",
      "host": "https://utv.webbplats.se",
      "acceptUnauthorizedCert": true,
      "production": false,
      "sign": false,
      "webdavRoot": "System",
    },
    "test": {
      "name": "Husets namn",
      "host": "https://test.webbplats.se",
      "production": false
    },
    "production": {
      "name": "Husets namn",
      "host": "https://webbplats.se",
      "production": true,
      "sign": true
    }
  }
}
```

### User config

Följande inställningar anges vanligtvis för `env` i `user_config.json` då dessa är personliga och känsliga.

* `key` - Nyckel för objekt med miljöinställningar.
  * `auth` - En base64-enkodad sträng med formatet `username:password`.

**user\_config.json**

```json
{
  "env": {
    "development": {
      "auth": "ZABlAHYAdQBzAGUAcgA6AHAAYQBzAHMA"
    },
    "test": {
      "auth": "ZABlAHYAdQBzAGUAcgA6AHAAYQBzAHMA"
    },
    "production": {
      "auth": "cAByAG8AZAB1AHMAZQByADoAcABhAHMAcwA="
    }
  }
}
```

> **Tips!**
>
> Om man temporärt vill bygga mot en annan miljö än den som är angiven i `project_config.json` kan man lägga in dessa inställningar i `user_config.json` istället.

## Browserslist

> **Används av**
>
> `@soleil-se/build-app`\
> `@soleil-se/build-sass`\
> `@soleil-se/build-js`

Babel och PostCSS använder [browserslist](https://github.com/browserslist/browserslist) för att veta vilka browsers som behöver stödjas.\
Enklast är att lägga in inställningarna i `package.json`.\
Om inget anges används `defaults` inställningen, vilken förmodligen kommer transformera allt och man vet inte när dessa inställningarna kan ändras.

Därför behöver oftast en konfiguration anges. Vanligaste kravet är att stödja senaste två versioner av de största webbläsarna och de fyra senaste av Safari.

**package.json**

```json
{
  "browserslist": [
    "last 2 chrome major versions",
    "last 2 firefox major versions",
    "last 4 ios_saf major versions",
    "last 2 edge major versions",
    "last 4 safari major versions",
    "last 2 and_chr major versions"
  ],
}
```

Eller om man vågar lita på statistik:

**package.json**

```json
{
  ...
  "browserslist": [
    "> 0.5% in SE",
    "not IE 11",
    "not dead"
  ],
}
```

## Globals

> **Används av**
>
> `@soleil-se/build-app`\
> `@soleil-se/build-js`

För att Rollup ska veta att ett paket finns tillgängligt globalt och vad den globala variabeln heter behöver man ställa in globals i `project_config.json`.\
Annars kommer en ny instans av paketet importeras i appen eller filen.

**project\_config.json**

```json
{
  "env": { ... },
  "rollup": {
    "server": { ... },
    "client": {
      "globals": {
        "jquery": "$svjq"
      }
    }
  }
}
```

## PostCSS

> **Används av**
>
> `@soleil-se/build-app`\
> `@soleil-se/build-sass`

Följande PostCSS plugins används:

`postcss-preset-env` (sedan version 2.0.0) är alltid på som standard, går att justera inställningar.\
<https://github.com/csstools/postcss-plugins/tree/main/plugin-packs/postcss-preset-env#readme>.

`autoprefixer` (del av `postcss-preset-env`), går att justera inställningar.\
<https://github.com/postcss/autoprefixer#options>.

`discard-duplicates` tar automatiskt bort duplicerad CSS.\
<https://github.com/cssnano/cssnano/tree/master/packages/postcss-discard-duplicates>

`pxtorem` behöver ställas in innan det används.\
<https://github.com/cuth/postcss-pxtorem#options>.

**project\_config.json**

```json
{
  "env": { ... },
  "css": {
    "plugins": {
      "presetEnv": {},
      "autoprefixer": {},
      "pxtorem": {
        "rootValue": 16
      }
    }
  }
}
```

## Flerspråkiga namn på appar

I Sitevision 10.1 introducerades stöd för [flerspråkiga namn på appar](https://developer.sitevision.se/archives/developer-news/developer-news/2022-01-28-multilingual-webapp-names).

Som standard kommer det svenska namnet (`name.sv` i `manifest.json`) att användas för själva tillägget i `sv:addonRepository`.\
Behöver man ändra detta kan man ange ett annat språk under `addonNameLang` i `project_config.json`.

**project\_config.json**

```json
{
  "env": { ... },
  "addonNameLang": "en"
}
```