Natuurlijk! Hier is een stapsgewijze handleiding om Cascade te configureren voor het automatisch analyseren en corrigeren van je codebase volgens jouw stijl- en formatteringsrichtlijnen in JavaScript, Python, en TypeScript, met focus op consistente inspringing en dubbele aanhalingstekens: 1. Installatie van Cascade: - Zorg dat je Cascade hebt geïnstalleerd in je project. Dit doe je bijvoorbeeld via npm: ```bash npm install --save-dev cascade ``` 2. Basisconfiguratie van Cascade: - Maak een configuratiebestand, bijvoorbeeld `.cascade.json` of `.cascaderc`, in de root van je project. 3. Integratie met ESLint en Prettier voor JavaScript en TypeScript: - Omdat Cascade niet rechtstreeks lintregels heeft, combineer het met ESLint en Prettier. - Installeer de benodigde plugins: ```bash npm install --save-dev eslint prettier eslint-config-airbnb eslint-plugin-prettier eslint-config-prettier ``` - Configureer ESLint (`.eslintrc.json`) om de Airbnb stijl te gebruiken en dubbele aanhalingstekens te verplichten: ```json { "extends": ["airbnb", "plugin:prettier/recommended"], "rules": { "quotes": ["error", "double"], "indent": ["error", 2] } } ``` - Configureer Prettier (`.prettierrc`) om dubbele aanhalingstekens te gebruiken: ```json { "singleQuote": false } ``` 4. Cascade configuratie voor stijlcontroles: - In `.cascade.json` voeg je configuraties toe om ESLint en Prettier te gebruiken voor linting en formattering: ```json { "rules": { "lint": { "enabled": true, "config": "eslint" }, "format": { "enabled": true, "config": "prettier" } }, "fileTypes": ["js", "jsx", "ts", "tsx"] } ``` 5. Detectie en Correctie van Stijlafwijkingen: - Configureer Cascade om automatisch lint- en formatteringsfouten te detecteren en te corrigeren: ```bash cascade lint --fix cascade format --fix ``` - Dit zorgt dat Cascade via ESLint en Prettier je code automatisch corrigeert volgens de ingestelde regels. 6. Stijlcontrole op Inspringing en Aanhalingstekens: - ESLint en Prettier zorgen hiervoor: - Consistente inspringing van 2 spaties (geconfigureerd in ESLint). - Gebruik van dubbele aanhalingstekens (geconfigureerd in ESLint en Prettier). 7. Automatisering en Integratie: - Voeg scripts toe aan je `package.json`: ```json "scripts": { "lint": "cascade lint --fix", "format": "cascade format --fix", "check": "cascade" } ``` - Integreer deze scripts in je CI/CD pipeline om automatisch code te controleren en te formatteren. 8. Documentatie en Best Practices: - Documenteer de configuratie en instructies voor je team. - Overweeg het gebruik van pre-commit hooks (bijvoorbeeld met Husky) om automatische correcties vóór commits te laten plaatsvinden. Door deze stappen te volgen, configureer je Cascade effectief om je codebase te analyseren, stijlafwijkingen te detecteren, automatisch te corrigeren en suggesties te geven voor het verbeteren van de codekwaliteit, allemaal afgestemd op jouw voorkeuren voor consistente inspringing en het gebruik van dubbele aanhalingstekens.

Hier is een stapsgewijze handleiding voor het ontwerpen van een AI-agent in Windsurf voor code stijlconsistentie: ## 1. Cascade Configuratie ### Basis Setup ```yaml # .cascade/config.yaml version: 1 rules: - name: code-style-enforcement description: "Handhaaf Airbnb JavaScript Style Guide met consistente inspringing en dubbele aanhalingstekens" triggers: - file_change - pre_commit actions: - analyze_code_style - auto_fix_violations - suggest_improvements ``` ## 2. Stijlregel Configuratie ### JavaScript/TypeScript (ESLint met Airbnb config) ```json // .eslintrc.json { "extends": ["airbnb-base", "airbnb-typescript/base"], "parserOptions": { "project": "./tsconfig.json" }, "rules": { "quotes": ["error", "double"], "indent": ["error", 2], "semi": ["error", "always"] } } ``` ### Python (Flake8 + Black config) ```ini # .flake8 [flake8] max-line-length = 88 extend-ignore = E203 ``` ```toml # pyproject.toml [tool.black] line-length = 88 target-version = ['py310'] ``` ## 3. Windsurf Agent Configuratie ```yaml # windsurf-agent.yaml agent: name: "code-style-guardian" version: "1.0" capabilities: - code_analysis - auto_formatting - style_suggestions triggers: - on_file_save - on_pull_request - manual_trigger rules: javascript: formatter: "prettier" linter: "eslint" config: ".eslintrc.json" typescript: formatter: "prettier" linter: "eslint" config: ".eslintrc.json" python: formatter: "black" linter: "flake8" config: "pyproject.toml" ``` ## 4. Automatische Detectie en Correctie ### Pre-commit Hook ```yaml # .pre-commit-config.yaml repos: - repo: https://github.com/pre-commit/mirrors-eslint rev: v8.45.0 hooks: - id: eslint files: \.(js|ts|jsx|tsx)$ args: [--fix, --config=.eslintrc.json] - repo: https://github.com/psf/black rev: 23.7.0 hooks: - id: black language_version: python3 ``` ## 5. Specifieke Stijlregels voor Jouw Vereisten ### Dubbele Aanhalingstekens ```json { "rules": { "quotes": ["error", "double", { "avoidEscape": true }], "jsx-quotes": ["error", "prefer-double"] } } ``` ### Consistente Inspringing ```json { "rules": { "indent": ["error", 2, { "SwitchCase": 1, "VariableDeclarator": 1, "outerIIFEBody": 1, "MemberExpression": 1, "FunctionDeclaration": { "parameters": 1, "body": 1 }, "FunctionExpression": { "parameters": 1, "body": 1 }, "CallExpression": { "arguments": 1 }, "ArrayExpression": 1, "ObjectExpression": 1, "ImportDeclaration": 1, "flatTernaryExpressions": false, "ignoreComments": false }] } } ``` ## 6. Windsurf Workflow Integratie ```typescript // windsurf-workflow.ts interface StyleViolation { file: string; line: number; rule: string; message: string; severity: 'error' | 'warning'; } class CodeStyleAgent { async analyzeCodebase(): Promise<StyleViolation[]> { // Implementeer analyse logica return this.runESLint() + this.runFlake8(); } async autoFixViolations(): Promise<void> { await this.runCommand('eslint --fix .'); await this.runCommand('black .'); } async provideSuggestions(): Promise<string[]> { // AI-gestuurde suggesties voor code kwaliteit return this.generateAISuggestions(); } } ``` ## 7. CI/CD Integratie ```yaml # .github/workflows/code-style.yml name: Code Style Check on: [push, pull_request] jobs: lint: runs-on: ubuntu-latest steps: - uses: actions/checkout@v3 - name: Setup Node uses: actions/setup-node@v3 - name: Run ESLint run: npx eslint . --config .eslintrc.json - name: Run Black Check run: black --check . ``` ## 8. Monitoring en Rapportage De agent kan: - **Real-time detectie** van stijlschendingen - **Automatische correcties** waar mogelijk - **Gedetailleerde rapporten** met verbeteringssuggesties - **Historische tracking** van codekwaliteit trends - **Team notificaties** bij terugkerende issues Deze configuratie zorgt voor consistente code stijl volgens jouw specificaties over alle programmeertalen heen, met speciale aandacht voor dubbele aanhalingstekens en consistente inspringing.