Strict coding standards and conventions

Chisel theme enforces consistent, review‑ready code across PHP, Twig, JS/TS, and SCSS. Standards are codified in configuration files and executed via NPM scripts and CI‑friendly commands, so every build stays clean and predictable.

Overview

• PHP: WordPress Coding Standards (WPCS) via PHPCS. Config: phpcs.xml
• Twig: Twig CS and Fixer. Config: twig_cs.php
• JavaScript/TypeScript: ESLint with shared configs, aligned to Prettier. Scripts configured in package.json
• Styles (SCSS/CSS): Stylelint (standard-scss + Prettier). Config from installed presets
• Devcontainer: VS Code extensions for ESLint/Stylelint/Prettier/EditorConfig are auto‑installed. Config: wp/.devcontainer/devcontainer.json

---

Enforced checks and commands

• Run all: npm run format-and-lint
• JS/TS: npm run lint:script (ESLint, autofix, honors .gitignore)
• SCSS/CSS: npm run lint:style (Stylelint, autofix)
• PHP: npm run phpcs (PHPCS + WPCS, per phpcs.xml)
• Twig: npm run twigcs (Twig CS per twig_cs.php)
• Format everything: npm run format (Prettier write)

---

PHP conventions

• Namespaces: Chisel... (e.g., ChiselWPAssets, ChiselPluginWoocommerce)
• Standards: WPCS “Core” with selective exclusions (see phpcs.xml):
  • Allows non‑Yoda conditions (WordPress.PHP.YodaConditions.NotYoda excluded)
  • Relaxes some file/class naming checks (e.g., WordPress.Files.FileName.* excluded)
  • Tweaked arrays/comparisons per rules file
• Hooks: Snake_case hook names e.g., chisel_frontend_footer_styles, chisel_enqueue_frontend_style
• Files ignored by PHPCS: build/, vendor/, views/, acf-json/, etc. (see phpcs.xml)

---

Twig conventions

• Locations:
  • Views: views/*.twig
  • Components: views/components/*
  • Objects: views/objects/*
  • Partials: views/partials/*
  • WooCommerce: views/woocommerce/*
• Linting: twigcs enforces formatting; twig-cs-fixer available for auto‑fix.

---

SCSS conventions

• Structure: ITCSS layers (e.g., src/styles/elements/_form.scss, src/styles/objects/_grid.scss)
• Stylelint presets: stylelint-config-standard-scss, stylelint-config-prettier-scss, stylelint-config-recess-order, stylelint-config-css-modules, plugin stylelint-prettier
• Rules: Enforce property order, SCSS best practices, and Prettier formatting.

---

JavaScript/TypeScript conventions

• Modules: src/scripts/modules/* (e.g., utils.js, load-more.js, slider.js) Keep modules focused and side‑effect free where possible.
• Linting: ESLint with Prettier integration (via @xfive/eslint-config-prettier and @wordpress/scripts), autofix enabled.

---

Other

• EditorConfig: Defines strict editor‑level rules (indent size, charset) outside Prettier’s scope.

---

Summary:

• Use the provided NPM scripts to auto‑enforce WPCS, Twig CS, ESLint, Stylelint, and Prettier.
• Follow namespacing/hook conventions and keep logic thin in Twig.
• Maintain modular JS and structured SCSS with Stylelint + Prettier guaranteeing consistency.