Prettier (Installation + Settings)

[seicke]

Preparatory work for the later use of Prettier

[seicke]

GitHub Action for format checking with Prettier:

name: Check formatting

on:
  pull_request:
    branches: [main]

jobs:
  prettier:
    runs-on: ubuntu-latest

    steps:
      - name: Checkout
        uses: actions/checkout@v3
        with:
          fetch-depth: 0
          ref: ${{ github.head_ref }}
          persist-credentials: false

      - name: Prettify code
        uses: creyD/prettier_action@v4.3
        with:
          dry: True
          working_directory: ./aas-gui/Frontend/aas-web-gui
          prettier_options: --check src/
          github_token: ${{ github.token }}

[aaronzi]

As a suggestion for prettier config to differentiate between different file types:

{
    "trailingComma": "es5",
    "tabWidth": 4,
    "useTabs": false,
    "semi": true,
    "singleQuote": true,
    "bracketSpacing": true,
    "bracketSameLine": true,
    "arrowParens": "always",
    "vueIndentScriptAndStyle": true,
    "printWidth": 120,

    "overrides": [
        {
            "files": "*.ts",
            "options": {
                "parser": "typescript"
            }
        },
        {
            "files": "*.vue",
            "options": {
                "parser": "vue",
                "vueIndentScriptAndStyle": true
            }
        },
        {
            "files": "*.json",
            "options": {
                "parser": "json",
                "tabWidth": 2,
                "trailingComma": "none"
            }
        },
        {
            "files": "*.js",
            "options": {
                "parser": "babel"
            }
        },
        {
            "files": "*.md",
            "options": {
                "proseWrap": "always"
            }
        },
        {
            "files": "*.css",
            "options": {
                "parser": "css"
            }
        },
        {
            "files": "*.yaml",
            "options": {
                "parser": "yaml",
                "tabWidth": 2
            }
        }
    ]
}