Ustawienia jakości kodu według języka w Visual Studio Code

Ostatnia aktualizacja lis 9, 2022

W poprzednich postach mówiłem trochę o Visual Studio Code i chociaż wypróbowałem wiele innych edytorów, wciąż wracam do tego konkretnego IDE.

Z biegiem czasu jest dość dojrzały, nadal to robi i pozwala na wiele dostosowań, szczególnie dla tych z nas, którzy pracują w PHP, Sass, JavaScript i, ogólniej mówiąc, WordPress.

Jeśli jednak użyjesz jakichkolwiek linterów, przekonasz się, że jedną z rzeczy, o których każdy będzie mówił, jest ilość spacji, która powinna istnieć przed daną linią kodu.

Jeśli więc używasz Visual Studio Code, są to rozszerzenia i ustawienia, które zalecam, aby upewnić się, że Twój kod jest zgodny z używanymi narzędziami jakości kodu.

Jakość kodu na język

Po pierwsze, rozszerzenia, które polecam każdej osobie zainstalować – przynajmniej jeśli pracujesz z powyższymi językami – obejmują:

ESLint. Integruje ESLint z kodem VS. (Jeśli jesteś nowy w ESLint, sprawdź dokumentację .)
PHPCS, który integruje standardy kodowania PHP (ustawione w preferencjach) z IDE.
Zestaw narzędzi WordPress zawiera fragmenty dla każdej funkcji, klasy i stałej WordPress, ze wskazówkami dotyczącymi typów argumentów i krótkimi opisami aż do WordPress 4.9.4 (w momencie pisania tego posta).

Po ich zainstalowaniu możesz ponownie uruchomić IDE lub dodać następujący kod do pliku preferencji, zanim to zrobisz. Możesz to zrobić globalnie lub na podstawie projektu. Albo jest w porządku. Skomentowałem kod, aby był jak najłatwiejszy do naśladowania.

Dodam też kilka uwag poniżej.


{
    // Tab Spacing per language.
    "[php]": {
      "editor.tabSize": 4,
      "editor.autoIndent": true
    },

    "[scss]": {
      "editor.tabSize": 2,
      "editor.autoIndent": true
    },

    "[javascript]": {
      "editor.tabSize": 2,
      "editor.autoIndent": true
    },

    // General Editor Settings
    "files.trimTrailingWhitespace": true,
    "php.suggest.basic": true,
    "php.validate.executablePath": "/usr/local/bin/php",
    "php.validate.run": "onType",
    "phpcs.enable": true,
    "phpcs.executablePath": "/usr/local/bin/phpcs",
    "phpcs.standard": "PSR2"
}

Tak to działa:

Dla każdego typu języka można zdefiniować pewne ustawienia, takie jak tabSize i czy autoIndent, tworząc definicję w pliku JSON.
W tym celu poprzedź definicję przyrostkiem pliku języka lub, w niektórych przypadkach (np. JavaScript), nazwą języka.

Kod na dole pliku, Ogólne ustawienia edytora są dostarczane jako niektóre dodatki, które możesz chcieć dołączyć. Na przykład lubię przycinać wszystkie końcowe spacje, sugerować podstawowe definicje PHP i zestaw standardów kodowania podczas pracy nad projektem.

Są to rzeczy, które generalnie są poza zakresem tego projektu (ale omówiłem w innych postach ). Ale wciąż wystarczy zacząć od wyższego poziomu jakości kodu na język niż ten, który jest oferowany po wyjęciu z pudełka.

Źródło nagrywania: tommcfarlin.com