Our office uses Visual Studio Code because it’s amazing! We highly recommend it. We will be providing links to extensions for VSCode.
If you are using composer, you can install PHP_CodeSniffer system-wide with the following command in your Terminal:
composer global require "squizlabs/php_codesniffer=*"
Follow the instructions that work best for your development environment.
Paste the following command into your Terminal and press enter to verify if PHPCS is installed correctly:
- In your Terminal, change directory to your User folder:
- Create a folder name “Utilities”:
- Change directory into the Utilities folder:
- Clone the WordPress Code Standards
git clone -b master https://github.com/WordPress-Coding-Standards/WordPress-Coding-Standards.git wpcs
Now that you’ve cloned the WordPress Code Standards, you’ll need to tell PHPCS to use them by default.
- Paste the following command into your Terminal and press enter. IMPORTANT: Change the path to wpcs to match your own.
phpcs --config-set installed_paths /Users/Greg/Utilities/wpcs
- Paste the following command into your Terminal to verify WordPress Code Standards were correctly configured:
- You should see something like this:
The installed coding standards are MySource, PEAR, PHPCS, PSR1, PSR2, Squiz, Zend, WordPress, WordPress-Core, WordPress-Docs, WordPress-Extra and WordPress-VIP
- Clone tcu_custom_ruleset repository
cd ~/Desktop git clone -b master email@example.com:TCUWebmanage/tcu_custom_ruleset.git
- Copy files into your theme/plugin
cd ~/Desktop/tcu_custom_ruleset cp .editorconfig .eslintrc.js .sass-lint.yml phpcs.xml /path/to/theme
- Configure the phpcs.xml custom properties. They are located at the bottom of file.
- Execute this NPM command in your terminal
npm install -g eslint sass-lint eslint-config-wordpress
- Now, add both ESLint and Sass Lint to your $PATH so they can run from the Terminal
- Close and reopen your Terminal so it can refresh the $PATH
which eslint sass-lint
As mentioned earlier, we use Visual Studio Code in our office so we recommend adding the extensions in the list below. You can easily find extensions for different code editors. You will need search for them.
Great Tutorial to set up different code editors at the bottom of this article