Tworzenie aplikacji platformy Vue.js

  • Artykuł

W tym 5-10-minutowym wprowadzeniu do zintegrowanego środowiska projektowego (IDE) programu Visual Studio utworzysz i uruchomisz prostą aplikację internetową frontonu Vue.js.

Wymagania wstępne

Upewnij się, że zainstalowano następujące elementy:

Tworzenie aplikacji

  1. W oknie Start (wybierz pozycję Okno uruchamiania pliku>, aby otworzyć), wybierz pozycję Utwórz nowy projekt.

    Screenshot showing Create a new project

  2. Wyszukaj pozycję Vue na pasku wyszukiwania u góry, a następnie wybierz pozycję Standalone JavaScript Vue Project lub Standalone TypeScript Vue Project w zależności od preferencji.

    Screenshot showing choosing a template

  3. Nadaj projektowi i rozwiązaniu nazwę, a następnie wybierz pozycję Dalej.

  4. Wybierz pozycję Utwórz, a następnie poczekaj, aż program Visual Studio utworzy projekt.

Wyświetlanie właściwości projektu

Domyślne ustawienia projektu umożliwiają kompilowanie i debugowanie projektu. Jeśli jednak musisz zmienić ustawienia, kliknij prawym przyciskiem myszy projekt w Eksplorator rozwiązań, wybierz pozycję Właściwości, a następnie przejdź do sekcji Kompilacja lub Debugowanie.

Uwaga

plik launch.json przechowuje ustawienia uruchamiania skojarzone z przyciskiem Uruchom na pasku narzędzi Debugowanie. Obecnie plik launch.json musi znajdować się w folderze .vscode .

Kompilowanie projektu

Wybierz pozycję Kompiluj>rozwiązanie kompilacji, aby skompilować projekt.

Uruchamianie projektu

Naciśnij klawisz F5 lub wybierz przycisk Start w górnej części okna i zostanie wyświetlony wiersz polecenia, taki jak:

  • Usługa VITE w wersji 4.4.9 jest gotowa w 780 ms

    Uwaga

    Sprawdź dane wyjściowe konsoli pod kątem komunikatów, takich jak komunikat informujący o zaktualizowaniu wersji środowiska Node.js.

Następnie powinna zostać wyświetlona podstawowa aplikacja Vue.js.

Następne kroki

W przypadku integracji ASP.NET Core:

Tworzenie aplikacji ASP.NET Core za pomocą programu Vue