Lepsze wykorzystanie sztucznej inteligencji w VS Code dzięki plikom poleceń
Sztuczna inteligencja w Visual Studio Code nie jest już tylko dodatkiem. Po połączeniu widoku AI Toolkit w VS Code ze starannie napisanym plikiem poleceń można przekształcić rutynowe zadania programistyczne w szybszy, bardziej uporządkowany proces pracy. W swoim filmie "Better Use AIs in VS Code with Prompt Files" Tim Corey pokazuje dokładnie, jak to robi, demonstrując praktyczny przykład wykorzystania modelu AI w kodzie źródłowym swojej własnej witryny.
W tym artykułe będziemy śledzić wyjaśnienia Tima, podkreślając, w jaki sposób podpowiedzi AI w vscode, praktyki inżynierii podpowiedzi oraz widok czatu łączą się, aby zapewnić bardziej wiarygodne i powtarzalne wyniki.
Dłączego pliki podpowiedzi mają znaczenie
W 0:00 Tim mówi: "Użycie pliku podpowiedzi z AI może zmienić doświadczenie z po prostu dobrego na świetne". Plik podpowiedzi mówi modelowi AI, jak ma myśleć, jak postępować i jak odpowiadać na polecenia użytkownika. Tim odnosi to do pliku "Beast Mode" autorstwa Burke'a Hollanda z firmy Microsoft, dużego komunikatu systemówego, który działa jak szablon. Korzystając z tego narzędzia, programiści mogą ograniczyć powtarzające się instrukcje, zmniejszyć liczbę błędów i uzyskać bardziej przewidywalny kod generowany w VS Code.
Tim określa to jako rodzaj inżynierii podpowiedzi: tworzysz zestaw instrukcji wielokrotnego użytku, dzięki czemu gdy później wpiszesz szybką podpowiedź użytkownika w oknie czatu lub klikniesz ikonę AI Toolkit na pasku aktywności, sztuczna inteligencja będzie już znała Twój styl kodowania i preferowaną strukturę projektu.
Zasoby programistyczne Tima
Przed zaprezentowaniem narzędzia Tim (0:27) podsumowuje oferowane przez siebie bezpłatne i płatne zasoby — dziewięć pełnych kursów, dziesiąty na stronie iamtimcorey.com oraz podcast, w którym odpowiada na pytania programistów. Podkreśla, że mają one pomóc programistom w doskonaleniu umiejętności i tworzeniu lepszych procesów pracy. To wyjaśnia, dłączego plik podpowiedzi AI dla VS Code ma znaczenie: jest on częścią nowoczesnych praktyk mających na celu usprawnienie codziennych zadań związanych z kodowaniem.
Konfiguracja trybu Beast Mode w VS Code
O 1:22 Tim przechodzi do sekcji narzędzi VS Code. Ma już zainstalowany tryb Beast Mode i wybrał go w sekcji "konfiguruj tryby". Wyjaśnia, że można otworzyć widok AI Toolkit, przeglądać modele z katalogu modeli i utworzyć nowy tryb niestandardowy. W tym przykładzie możesz kliknąć "Select Add Prompt", nadać mu nazwę, np. "GitHub Chat Modes", i wkleić zawartość pliku (1:34). Zapisuje to Twoje niestandardowe polecenie systemówe, dzięki czemu jest ono zawsze gotowe w Twoim obszarze roboczym.
Konfiguracja Tima pokazuje, jak modele lokalne lub chmurowe można połączyć z własnymi instrukcjami Builder. Wszystko jest uporządkowane w folderze głównym VS Code lub innym folderze, co ułatwia powtórzenie tego procesu w przyszłości.
Wykorzystanie sztucznej inteligencji w rzeczywistym projekcie
Od 2:03 Tim demonstruje działanie sztucznej inteligencji na swoim rzeczywistym projekcie strony internetowej hostowanym w obszarze roboczym VS Code. Otwiera kod sekcji "Learning Paths" — w zasadzie witryny opartej na Python/React — i pokazuje menu nawigacyjne aplikacji. Chce zmodyfikować ikonę strzałki, aby dodać małą animację po najechaniu kursorem (3:21).
Oto typowy scenariusz dla programisty: masz kod front-endowy, chcesz, aby agent AI wygenerował dla Ciebie CSS, i nie chcesz ręcznie wpisywać każdego szczegółu. Jeśli plik podpowiedzi jest już załadowany, Twoja podpowiedź dla użytkownika może być krótka, a sztuczna inteligencja uzupełni kontekst.
Przygotowanie polecenia dla AI
O 3:38 Tim używa narzędzia Windows Snipping Tool (Windows+Shift+S), aby wykonać zrzut ekranu pokazujący strzałkę (3:45). Ten kontekst wizualny pomaga sztucznej inteligencji. Następnie o godz. 4:43 wpisuje naturalne polecenie:
"W moim menu nawigacyjnym, w sekcji ścieżki nauki, obróć strzałkę z 30° do pozycji poziomej po najechaniu na nią myszką, a następnie z powrotem do pozycji pierwotnej po odsunięciu myszki. Oto zrzut ekranu przedstawiający aktualny wygląd strony.
Tim zaznacza, że później może dokładnie określić, gdzie umieścić CSS, ale na początek podaje następujące polecenie, aby przetestować działanie trybu Beast Mode.
Plan firmy Beast Mode
O godz. 6:00 Tim wyjaśnia, że tryb Beast Mode określa przebieg pracy: zidentyfikuj właściwy selektor, dodaj klasę CSS, dodaj efekt najechania kursorem, a następnie przetestuj i zweryfikuj. Umieszcza nawet CSS w odpowiednim pliku site.css powyżej katalogu głównego (6:42). To pokazuje, w jaki sposób predefiniowany schemat w pliku poleceń — czyli "zasady" dotyczące rozmieszczenia stylów — kieruje odpowiedzią AI.
Tim nazywa to "główną zaletą" korzystania z pliku podpowiedzi: dodaje on kontekst, pozwalając sztucznej inteligencji działać tak, jakby znała strukturę projektu, bez konieczności powtarzania pełnego opisu za każdym razem.
Iteracja i udoskonalanie
Kiedy Tim sprawdza stronę o 6:54, wygenerowany kod wpływa tylko na jedną strzałkę i to w złym kierunku. Następnie o godz. 7:29 dopracowuje polecenie, aby odwrócić efekt najechania kursorem i zastosować go do wszystkich strzałek.
O 8:49 zauważa, że teraz wszystkie strzałki obracają się jednocześnie. W związku z tym o godz. 9:06 wysyła kolejne polecenie użytkownika, nakazujące AI zastosowanie efektu wyłącznie do elementu, nad którym znajduje się kursor. Tim zauważa o 9:38: "Trzeba dopracować sztuczną inteligencję". Nie zawsze działa tak, jak powinno.
To świetny przykład inżynierii promptów w oknie czatu. Edytujesz, powtarzasz i zapisujesz swoje polecenia, aż sztuczna inteligencja wygeneruje pożądaną, uporządkowaną treść. Ponieważ plik poleceń zawiera już polecenie systemówe, każda nowa instrukcja stanowi jedynie niewielkie udoskonalenie.
Wynik końcowy
O 9:52 Tim potwierdza, że animacja działa teraz zgodnie z instrukcją: obrót po najechaniu kursorem, reset po usunięciu kursora. Zauważa, że można przełączyć się na jasny lub ciemny motyw, zmienić kolory, spowolnić przejście — cokolwiek chcesz (10:02). Kluczowe jest to, że sztuczna inteligencja rozgryzła transformację SVG i napisała dla niego kod CSS (10:11).
W godzinach 10:30–11:20 Tim wyjaśnia, że można rozszerzyć tryb Beast Mode lub stworzyć własny plik Builder, aby zdefiniować sposób rozmieszczenia plików, sposób formatowania kodu lub sposób wywoływania funkcji w języku Python. Wówczas codzienne polecenia mogą być znacznie krótsze, a mimo to nadal generować spójne odpowiedzi.
Przeglądanie wyników AI
O 11:50 Tim ostrzega, aby zawsze przeglądać zmiany AI. Nawet przy zabezpieczonym pliku z komendami i dobrych praktykach, możliwe jest, że AI doda klasę w niewłaściwym miejscu lub zepsuje twoje wymagańe zależności. W jego przykładzie AI dokonało tylko małych, rozsądnych zmian — dodając klasę CSS tutaj, linię kodu tam — ale programiści powinni nadal sprawdzać log zmian i doskonalić, jeśli to potrzebne.
Tim kończy, zauważając, że kiedy uzyskasz wynik, który ci się podoba, możesz go zapisać i ponownie użyć. To jest istota korzystania z modeli AI i plików z komendami wewnątrz VS Code: powtarzalny, spójny przepływ pracy, który zamienia okazjonalne sugestie w niezawodne doświadczenie podobne do SDK.
Wnioski z pokazu Tima Coreya
Podążając za demonstracją Tima Coreya w wideo pokazano, jak dobrze zaprojektowany plik z komendami w Visual Studio Code może:
-
Zapewnić spójny kontekst dla modeli AI, aby twoje komendy mogły być krótsze.
-
Automatycznie obsługiwać wygenerowany kod, ustrukturyzowany wynik i formatowanie.
-
Zintegrować się z twoim środowiskiem pracy, paskiem aktywności i AI Toolkit, abyś mógł łatwo otwierać, testować i doskonalić komendy.
- Pozwalać na przeglądanie modeli, przełączanie się między modelami lokalnymi lub w chmurze oraz stosowanie twoich zasad inżynierii komend bezproblemowo.
Przechowując swoje zasady w pliku z komendami, dajesz AI wiarygodny skrypt agenta do naśladowania, pozwalając ci skupić się na zadaniach wysokiego poziomu zamiast na powtarzaniu tych samych instrukcji.


