Główne wydanie programu formatującego kod – Prettier, ukazało się w marcu. Teraz otrzymaliśmy drugą już jego aktualizację. Prettier 2.2 otrzymało nowe parsery JS oraz samodzielne pakiety ESM i obsługę TypeScript  4.1.

Parsery JavaScript

Jedną z najważniejszych nowości jest dodanie nowych wartości do opcji parser – espree i meriyah. Pierwszy z nich jest domyślnym parserem, z którego korzysta ESLint. Co ważne – działa tylko dla gotowych propozycji ECMAScript. Jest także zdecydowanie bardziej rygorystyczny od parsera Babel. Z kolei meriyah jest następcą cherow.

Inne nowości JS w Prettier 2.2

Naprawiono także błędy pojawiające się w komentarzach wewnątrz literałów szablonów z wbudowaną składnią. Poprawiono także formatowanie przypisań klas z długimi nazwami nadklas. Dzięki temu ulepszone jest formatowanie przestrzeni nazw Google Closure Library.

aaaaaaaa.bbbbbbbb.cccccccc.dddddddd.eeeeeeee.ffffffff.gggggggg2 = class extends (
  aaaaaaaa.bbbbbbbb.cccccccc.dddddddd.eeeeeeee.ffffffff.gggggggg1
) {
  method() {
    console.log("foo");
  }
};

Jednak wprowadzenie tej poprawki spowodowało, że nazwa jest zawijania niezależnie od długości. Dlatego też trwają prace nad udoskonaleniem tej zmiany.

Input:

module.exports = class A extends B {
  method () {
    console.log("foo");
  }
};

Output:

module.exports = class A extends (
  B
) {
  method() {
    console.log("foo");
  }
};

Aktualizacja @babel/parser do wersji 7.12

Zaktualizowanie Babel 7.12 dostarczyło m.in. obsługę propozycji bloku statycznego klasy wsparcia.

class C {
  static #x = 42;
  static y;
  static {
    try {
      this.y = doSomethingWith(this.#x);
    } catch {
      this.y = "unknown";
    }
  }
}

Ponadto poprawia kilka błędów i obsługuje nową składnię. W wersji 2.1 wprowadzono obsługę atrybutów modułów ES i modułów JSON. W nowym wydaniu Prettier 2.2 obsługa została znacznie uproszczona i zmieniła nazwę na “import assertions” (asercje importów).

Zmiany w API Prettier 2.2

Kolejne zmiany wprowadzono w API programu. Przede wszystkim dodano samodzielne pakiety ECMAScript Modules (ESM). Dzięki temu mogą być one używane bezpośrednio w przeglądarkach.

import prettier from "https://unpkg.com/prettier/esm/standalone.mjs";
import parserGraphql from "https://unpkg.com/prettier/esm/parser-graphql.mjs";

prettier.format("query {     }", {
  parser: "graphql",
  plugins: [parserGraphql],
});

Obsługa TS 4.1

Wiele narzędzi aktualizuje się do najnowszych wersji języków. Tak samo zadziałali twórcy Prettier. Wydanie 2.2 wspiera najnowszą wersję TypeScript 4.1. Oznacza to, że Prettier obsługuje teraz typy literałów szablonowych oraz remapowanie kluczy w typach mapowanych. Nowości z TypeScript znajdują się w tym artykule.

Pozostałe zmiany w Prettier 2.2

Pojawiły się także poprawki w niespójnym formatowaniu slotów. Ponadto Prettier obsługuje teraz script[setup] i style[vars] z Vue 3. W HTML naprawiono awarię, która pojawiała się podczas wczytywania Node.sourceSpan. Dodano także obsługę linków [[wiki-style]]. Zapewnia ona, że łącza nie będą zerwane przez formatowanie Prettier, ponieważ są zawijane w wiele linii. Ponadto treść odsyłacza znajdująca się w [[ ]] nawiasach, traktuje się jako nieprzetworzony tekst.

Źródło: Prettier Blog