Jump to Navigation Jump to Main Content Jump to Footer
Home » Docs » Features » Strict coding standards and conventions

Strict coding standards and conventions

Chisel theme enforces consistent, review-ready code across PHP, Twig, JS 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

LanguageLinter / FormatterConfig FileNPM Script
PHPPHP CodeSniffer (WordPress Standards)phpcs.xmlnpm run phpcs
TwigTwigCS (FriendsOfTwig)twig_cs.phpnpm run twigcs
JS/TSESLint + Prettier.eslintrc.cjsnpm run lint:script
SCSSStylelint + Prettierstylelint.config.mjsnpm run lint:style
GeneralPrettierprettier.config.mjsnpm run format

Enforced checks and commands

All quality checks are run automatically during the build process:

npm run build
Bash

This command runs independent tasks in parallel:

  • npm run build-scripts (Webpack)
  • npm run lint (ESLint + Stylelint)
  • npm run phpcs
  • npm run twigcs

You can also run a formatter for supported files (JS, JSON, SCSS, MD) using:

npm run format
Bash

PHP conventions

We adhere to the WordPress Coding Standards with some practical adjustments.

  • Engine: phpcs (PHP_CodeSniffer)
  • Ruleset: WordPress-Core, WordPress-Docs, WordPress-Extra (partial)
  • Indent: Tabs (enforced by .editorconfig)

Key Configuration (phpcs.xml):

  • Excluded paths: vendor/node_modules/dist/build/acf-json/.
  • Allowed: Short ternary operator ?:.
  • Relaxed: File naming conventions for classes are relaxed (WordPress.Files.FileName.InvalidClassFileName excluded) to allow for cleaner autoloading structures.
  • Excluded: Yoda conditions (WordPress.PHP.YodaConditions.NotYoda excluded)

To check your PHP files:

npm run phpcs
Bash

Twig conventions

Twig templates are validated for syntax and coding style.

  • Engine: friendsoftwig/twigcs
  • Ruleset: Official
  • Scan paths: views/, custom/views/src/blocks/src/blocks-acf/
  • Severity: Warning (Blocking)

To check your Twig files:

npm run twigcs
Bash

SCSS conventions

Styles are linted for syntax, ordering, and conventions.

  • Engine: stylelint
  • Presets:
    • stylelint-config-standard-scss
    • stylelint-config-css-modules
    • stylelint-config-recess-order (Sorts properties automatically)
    • stylelint-prettier
  • Formatting: Prettier
  • Class Naming: Enforced regex pattern allowing:
    • camelCase (.myClass)
    • kebab-case (.my-class)
    • BEM (.block__element--modifier)

To check your SCSS files:

npm run lint:style
Bash

JavaScript conventions

Modern JavaScript is linted and formatted to ensure best practices and prevent errors.

  • Engine: eslint
  • Presets:
    • eslint:recommended
    • plugin:react/recommended
    • @xfive/eslint-config-prettier
  • Formatting: Prettier
  • Environment: Browser, Node, ES2021

To check your JS files:

npm run lint:script
Bash

Editor Configuration

The project includes an .editorconfig file that automatically configures your editor (VS Code, PhpStorm, etc.) for:

  • Indentation: Spaces (2) for JS/SCSS/JSON, Tabs for PHP.
  • Line endings: LF.
  • Charset: UTF-8.
  • Whitespace: Trim trailing whitespace, ensure final newline.

Do you like Chisel?

Give it a star on GitHub!