devnews.pl

Main Menu

  • Informacje
    • Systemy i przeglądarki
    • Gadżety
  • Narzędzia
  • Frontend
  • Backend
  • QA
  • Języki programowania

logo

devnews.pl

  • Informacje
    • Systemy i przeglądarki
    • Gadżety
  • Narzędzia
  • Frontend
  • Backend
  • QA
  • Języki programowania
Frontend
Home›Frontend›Od dzisiaj Svelte obsługuje TypeScript

Od dzisiaj Svelte obsługuje TypeScript

By Bernadeta Zapała
22 lipca 2020
252
0
Share:

Oficjalnie! Svelte obsługuje TypeScript! Jest to jedna z najbardziej oczekiwanych i pożądanych funkcji. Dla programistów oznacza to ulepszenie aplikacji internetowych oraz dostarczenie przyjemniejszych wrażeń z programowania.

Co wynika ze wsparcia dla TypeScript w Svelte?

Wcześniej, aby skorzystać z TypeScript w Svelte trzeba było korzystać z wielu dodatkowych narzędzi. Każdy projekt działał niezależnie. Jednak teraz wszystkie z używanych narzędzi działają w ramach Svelte. Pracownicy Svelte już przed wybuchem pandemii planowali integrację tych narzędzi, aby ułatwić korzystanie z TypeScript.

Instalacja Svelte z TypeScript

Aby wypróbować Svelte z TypeScript, korzystając z tradycyjnego szablonu, należy uruchomić node scripts/setupTypeScript.js:

npx degit sveltejs/template svelte-typescript-app
cd svelte-typescript-app
node scripts/setupTypeScript.js

Svelte obsługuje TypeScript

Jak to wszystko tak właściwie działa?

Obsługę Typescript można porównać do techniki używanej przez TS do dostarczania narzędzi programistycznych.

Mowa o kompilatorze tsc, uruchamianym na linii poleceń do konwersji *.ts do *.js. Dalej jest TSServer, który jest węzłem API odpowiadającym na żądania edytorów tekstu. I to właśnie on zapewnia całą introspekcję w czasie rzeczywistym JS oraz TS dla redaktorów podczas pisania.

W przypadku Svelte także mamy kompilator – svelte-language-server, odpowiadający na wywołania edytora za pośrednictwem LSP (Language Server Protocol). Pierwsza klasa obsługi TypeScript oznacza, że oba te systemy radzą sobie z obsługą kodu TS.

Dodawanie TypeScript do istniejącego projektu

Zanim rozpoczniesz, dodaj zależności:

npm install  --save-dev @tsconfig/svelte typescript svelte-preprocess svelte-check
  1. Kompilowanie TypeScript – konfiguracja svelte-preprocess, który przekazuje zawartość bloków <script lang=”ts”> przez kompilator TypeScript.
  2. Wsparcie edytora – można korzystać z każdego edytora korzystającego z LSP. Rozszerzenie do tego protokołu poprawia jakość kodowania.
  3. Kontrole CI – do kontroli błędów służy narzędzie CLI: svelte-check. Działa tak, jak edytor proszący o błędy we wszystkich plikach .svelte.

Svelte obsługuje TypeScript – zalety

Wsparcie TypeScript daje wiele nowych możliwości:

  • Przy pomocy polecenia svelte-check można sprawdzać typ komponentu z TypeScript.
  • Obsługa interfejsu API składnika Svelte przez pliki TypeScript – koniec z czerwonymi zawijasami podczas importowania  pliku .svelte do  modułu .ts
  • Wewnątrz bloków <script> korzystaj z TypeScript – wystarczy dodać atrybut lang=”ts”
  • Podczas pisania komponentów otrzymujesz wskazówki dotyczące autouzupełniania, także w wyrażeniach wewnątrz znaczników.
TagsCollaborationJavaScriptSvelteTypescript

Share:

  • Systemy i przeglądarki

    Aktualizacje Google Chrome 86 i Canary

  • Microsoft Launcher na Androida
    Narzędzia

    Microsoft Launcher 6.2 na Androida z nowymi funkcjami

  • InformacjeSystemy i przeglądarki

    Wprowadzenie Flutter do Windows przez Google

  • 3 marca 2021

    Vite 2.0 wydane z nowymi wtyczkami

  • 25 lutego 2021

    ReacType 5.0 – zmiany we wprowadzaniu komponentów

  • 23 lutego 2021

    Dapr v.1.0 gotowy do fazy produkcji

  • 22 lutego 2021

    ReScript 9.0 z zewnętrzną konfiguracją stdlib

  • 22 lutego 2021

    One UI 3.1 z ciekawymi nowościami dla urządzeń Samsunga

  • 22 lutego 2021

    Windows Terminal Preview 1.6 z nową sekcją ustawień

  • 15 lutego 2021

    Visual Studio Code 1.53 z ulepszeniami debugowania

  • 8 lutego 2021

    Edge 89 beta, Edge Dev 90 i nowości na kanale Canary

  • 2 lutego 2021

    Firefox 85 i Firefox Nightly – nowe wersje przeglądarki Mozilli

  • 29 stycznia 2021

    Billboard.js 2.2.0 z nowymi funkcjami wykresów

  • 26 stycznia 2021

    Kendo UI R1 2021 – nowości dla bibliotek

  • 21 stycznia 2021

    Narzędzie Vno – połączenie Vue i Deno

  • 19 stycznia 2021

    GitHub Enterprise Server 3.0 RC – kandydat do wydania

  • 15 stycznia 2021

    TypeScript 4.2 Beta z ulepszeniami typów krotek

  • 13 stycznia 2021

    Styczniowy Patch Tuesday z luką 0-day

  • 11 stycznia 2021

    Safari Technology Preview 118 dostępne dla programistów

  • 8 stycznia 2021

    Microsoft Launcher na Androida z usprawnionym dotykiem

  • 7 stycznia 2021

    WebStorm 2020.3.1 dostępny dla urządzeń z Apple Silicon

  • 22 grudnia 2020

    ReScript 8.4 z przypiętymi zależnościami

  • 14 grudnia 2020

    Edge 88 beta i przeglądarka na kanale Canary dostępne!

  • 9 grudnia 2020

    Chrome 88 Beta z nowościami w WebXR

  • 9 grudnia 2020

    Snowpack 3.0 RC z eksperymentalnymi funkcjami

  • 4 grudnia 2020

    Android Studio Arctic Fox – nowe wydanie narzędzia Google

  • 4 grudnia 2020

    The Hack Summit 2020 – konferencja IT Security

  • 2 grudnia 2020

    PowerToys 0.27 z poprawkami błędów

  • 2 grudnia 2020

    Aleph.js alfa z funkcją importowania map

  • 27 listopada 2020

    Cypress 6.0 zwiększa zakres możliwości obsługi sieci

  • 26 listopada 2020

    Firefox 83 przyspiesza i wprowadza tryb HTTPS-Only

  • 25 listopada 2020

    Electron 11.0 z obsługą Apple Silicon

  • 25 listopada 2020

    Prettier 2.2 z obsługą najnowszego TypeScript 4.1

 

 

Jesteśmy pasjonatami najnowszych technologii w świecie programowania. Zbieramy dla Was informacje i porady z całego świata, które sprawią, że Twoja praca stanie się jeszcze bardziej efektywna.

Obserwuj nas codziennie, aby być na bieżąco oraz śmiało udostępniaj nasze posty.

Zespół DevNews

Kategorie

  • Backend
  • Bez kategorii
  • Frontend
  • Gadżety
  • Informacje
  • Języki programowania
  • Narzędzia
  • QA
  • Systemy i przeglądarki

OBSERWUJ NAS

KONTAKT

Chcesz się z nami skontaktować?

Napisz do nas wiadomość: kontakt@devnews.pl

www.devnews.pl | DEVNEWS 2020 | Newsy i ciekawostki ze świata IT