WebStorm 2018 w pełni zintegrowany z Prettier

WebStorm 2018 dodaje integrację z Prettier, lepszą obsługę Vue.js i React Native oraz całkowicie przeprojektowuje dokumentacje.

Nowy interfejs dokumentacji
Poznaj nowe, bardziej kompaktowe i lekkie podręczne okienko informacyjne. Prezentuje w bardziej przejrzysty sposób informacje wprowadzane i zwracane w JavaScript i TypeScript. 




Ulepszenia TypeScript
Oprócz obsługi najnowszych funkcji TypeScript 2.7, aktualizacja ta usprawnia działanie elementów narzędziowych i dodaje nowy system Surround z funkcja szybkiej naprawy dla nierozwiązanych kwestii. WebStorm rozpoznaje teraz także pliki konfiguracyjny TypeScript o nazwach innych niż tsconfig.json.




Zmiana nazwy klasy i pliku jednocześnie
Teraz, jeśli uruchomisz Refactor – Rename dla klasy, WebStorm zasugeruje również zmianę nazwy pliku i jego zastosować, jeśli ma taką samą nazwę jak klasa. A jeśli naciśniesz Alt-Enter na nazwie klasy lub interfejsu, zobaczysz nową intencję, która zasugeruję zmianę nazwy pliku na tę nazwę.




Reformatowanie za pomocą Prettier
Dzięki nowej operacji Reformat z Prettier (Alt-Shift-Cmd/Ctrl-P) można sformatować wybrany kod, plik lub cały katalog przy użyciu Prettier. Zwróć uwagę, że Prettier powinien być zainstalowany na twoim komputerze.




Tworzenie nowych projekt Vue
Możesz teraz tworzyć nowe projekty Vue w WebStorm przy użyciu Vue CLI. Zainstaluj go, uruchamiając -g vue-cli, następnie utwórz Nowy projekt Vue.js na ekranie powitalnym IDE i odpowiedz na pytania dotyczące szablony i narzędzi, które chcesz użyć w swoim nowym projekcie.




Wyodrębnianie składników Vue
Utwórz nowy komponent z istniejącego Vue, bez kopiowania i wklejania – wybierz część szablonu i użyj Refactor – Extract i naciśnij Alt-Enter i wybierz Exctact Vue Component. WebStorm utworzy nowy komponent pojedynczy i przekaże mu wszystkie dane.




Debugowanie natywne React
Dzięki zaktualizowane konfiguracji React Native, WebStorm obsługuje teraz więcej scenariuszy uruchamiania i debugowania. Możesz teraz oddzielnie skonfigurować uruchamianie pakietu, a także dołączyć debugger do aplikacji, która jest już zbudowana lub uruchomiona na urządzeniu. Co więcej, możesz teraz debugować aplikacje korzystające z Expo bezpośrednio w IDE.




Konfigurowalny menadżer pakietów
Ułatwiono konfigurację menedżerów pakietów w WebStorm - w preferencjach Node.js i npm można wybrać między npm a Yarn, a następnie użyć go do zainstalowania zależności i uruchomienia skryptów. A jeśli otworzysz nowy projekt z plikiem yarn.lock, WebStorm użyje w nim Yarn, jeśli jest zainstalowany.




Nowa konsola do debugowania Node.js
Debugger Node.js ma teraz dwie karty konsoli – kartę konsoli, która pokazuje dane wyjściowe samego procesu oraz nową konsolę debugowania, w której można wykonać JavaScript, wyświetlić komunikaty konsoli.log i przejść do lokalizacji.




Częściowe zatwierdzenia w Git
Dzięki obsłudze częściowych zatwierdzeń Git możesz teraz zatwierdzać tylko wybrane zmiany z pliku. Użyj pól wyboru w widoku różnic w oknie dialogowym Zatwierdź zmiany, aby wybrać fragment kodu, który chcesz zatwierdzić.



Więcej ulepszeń Git
W szczegółach zatwierdzenia można teraz kliknąć odpowiedni skrót, aby przejść do tego zatwierdzenia w dzienniku.

Inne ulepszenia:

• Jeśli przeprowadzisz migrację do webpack 4, WebStorm może teraz sprawdzić i uzupełnić nazwy opcji w pliku konfiguracyjnym Webpack.
• Podobnie jak w przypadku testów, można teraz uruchomić skrypty npm za pomocą ikon bezpośrednio w edytorze.
• Po skopiowaniu kodu HTML do plików JSX, WebStorm automatycznie zastąpi funkcje klas.
• Lepsze kodowanie dla właściwości i wartości SVG w plikach CSS.
• Możesz teraz zsynchronizować ustawienia IDE dla wielu komputerów za pomocą swojego konta JetBrains.
• Poprawione uzupełnianie kodu i przejścia do definicji dynamicznych importów za pomocą  funkcji import.

Kup WebStorm