Opracowywanie kodu JavaScript i TypeScript w Visual Studio bez rozwiązań lub projektów

Kod można opracowywać bez projektów lub rozwiązań. Takie podejście umożliwia otwarcie folderu kodu i natychmiastowe rozpoczęcie pracy z obsługą zaawansowanego edytora, takiego jak IntelliSense, wyszukiwanie, refaktoryzacja, debugowanie i nie tylko. Oprócz tych funkcji narzędzia Node.js Tools for Visual Studio dodaje obsługę kompilowania plików TypeScript, zarządzania pakietami npm i uruchamiania skryptów npm.

Aby rozpocząć, wybierz pozycję Plik>Otwórz>folder na pasku narzędzi. Eksplorator rozwiązań wyświetla wszystkie pliki w folderze i można otworzyć dowolny plik, aby rozpocząć edycję. W tle Visual Studio indeksuje pliki, aby włączyć funkcje npm, kompilacji i debugowania.

Wymagania wstępne

• Musi być zainstalowane obciążenie Visual Studio Programowanie w środowisku Node.js

Integracja narzędzia npm

Jeśli otwarty folder zawiera plik package.json , możesz kliknąć prawym przyciskiem myszy package.json , aby wyświetlić menu kontekstowe (menu skrótów) specyficzne dla narzędzia npm.

W menu skrótów można zarządzać pakietami zainstalowanymi przez narzędzie npm w taki sam sposób, jak zarządzanie pakietami npm podczas korzystania z pliku projektu.

Ponadto menu umożliwia również uruchamianie skryptów zdefiniowanych w elememencie scripts w package.json. Te skrypty będą używać wersji Node.js dostępnej w zmiennej środowiskowej PATH . Skrypty są uruchamiane w nowym oknie. Jest to doskonały sposób wykonywania kompilacji lub uruchamiania skryptów.

Kompilowanie i debugowanie

package.json

Jeśli plik package.json w folderze zawiera element main, polecenie Debug jest dostępne w menu skrótów po kliknięciu prawym przyciskiem myszy dla pliku package.json. Po wybraniu tego polecenia uruchamia node.exe z określonym skryptem jako argumentem.

Jeśli polecenie Debugowanie nie uruchamia aplikacji poprawnie, upewnij się, że plik package.json zawiera skrypt startowy, taki jak poniższy przykład.

"main": "index.js",
"scripts": {
  "start": "node index.js",
  "test": "echo \"Error: no test specified\" && exit 1"
},

W tym przykładzie możesz uruchomić skrypt startowy z package.json, klikając prawym przyciskiem myszy package.json w Eksplorator rozwiązań i wybierając polecenie Npm npm>run script start ( Uruchom skrypt npm).

Pliki JavaScript

Możesz debugować pliki JavaScript, klikając prawym przyciskiem myszy plik i wybierając polecenie Debuguj z menu skrótów. Spowoduje to rozpoczęcie node.exe z tym plikiem JavaScript jako argumentem.

Jeśli polecenie Debugowanie nie uruchamia aplikacji poprawnie, użyj metody opisanej w sekcji package.json , aby uruchomić skrypt uruchamiania.

Pliki TypeScript i tsconfig.json

Jeśli w folderze nie ma tsconfig.json , możesz kliknąć prawym przyciskiem myszy plik TypeScript, aby wyświetlić polecenia menu skrótów, aby skompilować i debugować ten plik. W przypadku korzystania z tych poleceń kompilujesz lub debugujesz przy użyciu tsc.exe z opcjami domyślnymi. (Przed rozpoczęciem debugowania należy skompilować plik).

Jeśli w folderze znajduje się plik tsconfig.json , możesz kliknąć prawym przyciskiem myszy plik TypeScript, aby wyświetlić polecenie menu w celu debugowania tego pliku TypeScript. Opcja jest wyświetlana tylko wtedy, gdy w outFilenie ma określonej wartości . Jeśli określono plik outFile, możesz debugować ten plik, klikając prawym przyciskiem myszy plik tsconfig.json i wybierając odpowiednią opcję. Plik tsconfig.json udostępnia również opcję kompilacji, aby umożliwić określanie opcji kompilatora.

Testy jednostkowe

Integrację testów jednostkowych można włączyć w programie Visual Studio, określając katalog główny testów w pliku package.json:

{
    // ...
    "vsTest":{
        "testRoot": "./tests"
    }
    // ...
}

Moduł uruchamiający testy wylicza pakiety zainstalowane lokalnie, aby określić, która platforma testowa ma być używana. Jeśli żadna z obsługiwanych struktur nie jest rozpoznawana, moduł uruchamiający testy domyślnie ma wartość ExportRunner. Inne obsługiwane platformy to:

• Mocha (mochajs.org)
• Jasmine (Jasmine.github.io)
• Taśma (github.com/substack/tape)
• Jest (jestjs.io)

Po otwarciu Eksploratora testów (wybierz pozycję Test>Eksplorator testów systemu Windows>), program Visual Studio odnajduje i wyświetla testy.