Typescript install windows 10

Download TypeScript

TypeScript can be installed through three installation routes depending on how you intend to use it: an npm module, a NuGet package or a Visual Studio Extension.

If you are using Node.js, you want the npm version. If you are using MSBuild in your project, you want the NuGet package or Visual Studio extension.

TypeScript in Your Project

Having TypeScript set up on a per-project basis lets you have many projects with many different versions of TypeScript, this keeps each project working consistently.

via npm

TypeScript is available as a package on the npm registry available as «typescript» .

You will need a copy of Node.js as an environment to run the package. Then you use a dependency manager like npm, yarn or pnpm to download TypeScript into your project.

npm install typescript —save-dev

All of these dependency managers support lockfiles, ensuring that everyone on your team is using the same version of the language. You can then run the TypeScript compiler using one of the following commands:

with Visual Studio

For most project types, you can get TypeScript as a package in Nuget for your MSBuild projects, for example an ASP.NET Core app.

• The Manage NuGet Packages window (which you can get to by right-clicking on a project node)
• The Nuget Package Manager Console (found in Tools > NuGet Package Manager > Package Manager Console) and then running:
  Install-Package Microsoft.TypeScript.MSBuild

For project types which don’t support Nuget, you can use the TypeScript Visual Studio extension. You can install the extension using Extensions > Manage Extensions in Visual Studio.

The examples below are for more advanced use cases.

Globally Installing TypeScript

It can be handy to have TypeScript available across all projects, often to test one-off ideas. Long-term, codebases should prefer a project-wide installation over a global install so that they can benefit from reproducible builds across different machines.

via npm

You can use npm to install TypeScript globally, this means that you can use the tsc command anywhere in your terminal.

To do this, run npm install -g typescript . This will install the latest version (currently 5.1 ).

via Visual Studio Marketplace

You can install TypeScript as a Visual Studio extension, which will allow you to use TypeScript across many MSBuild projects in Visual Studio.

Working with TypeScript-compatible transpilers

There are other tools which convert TypeScript files to JavaScript files. You might use these tools for speed or consistency with your existing build tooling.

Each of these projects handle the file conversion, but do not handle the type-checking aspects of the TypeScript compiler. So it’s likely that you will still need to keep the above TypeScript dependency around, and you will want to enable isolatedModules .

Babel

Babel is a very popular JavaScript transpiler which supports TypeScript files via the plugin @babel/plugin-transform-typescript.

swc

swc is a fast transpiler created in Rust which supports many of Babel’s features including TypeScript.

Sucrase

Sucrase is a Babel fork focused on speed for using in development mode. Sucrase supports TypeScript natively.

Next Steps

Get Started

Источник

Typescript install windows 10

Чтобы начать работать с TypeScript, установим необходимый инструментарий. Установить TypeScript можно двумя способами: через пакетный менеджер NPM или как плагин к Visual Studio

Установка через NPM

Для установки через NPM вначале естественно необходимо установить Node.js (если он ранее не был установлен). После установки Node.js необходимо запустить следующую команду в командной строке (Windows) или терминале (Linux):

При установке на MacOS также требуется ввести команду sudo . При вводе данной команды терминал запросит логин и пароль пользователя для установки пакета:

sudo npm install -g typescript

Вполне возможно, что ранее уже был установлен TS. В этом случае его можно обновить до последней версии с помощью команды

Для проверки версии необходимо ввести команду

Компиляция приложения

Для начала создадим каталог приложения. В моем случае это будут папка по пути C:/typescript . В каталог добавим файл index.html . Откроем этот файл в любом текстовом редакторе и определим в нем следующий код:

Это обычный файл html, в котором определен пустой заголовок — элемент — в него мы будем выводить некоторое содержимое. И также на веб-странице подключается файл app.js .

Теперь в том же каталоге создадим файл app.ts . Причем именно app.ts , а не app.js, то есть файл кода typescrypt. Это также обычный текстовый файл, который имеет расширение .ts . И в app.ts определим следующее содержание:

class User < name : string; constructor(_name:string)< this.name = _name; >> const tom : User = new User("Том"); const header = this.document.getElementById("header"); header.innerHTML = "Привет " + tom.name;

Что здесь происходит? Сначала определяет класс User — шаблон данных, которые будут использоваться на веб-странице. Этот класс имеет поле name , которое представляет тип string , то есть строку. Для передачи данных этому полю определен специальный метод — constructor , который принимает через параметр _name некоторую строку и передает ее в поле name :

Далее мы подробнее разберем создание и использование классов. Далее создаем константу tom , которая представляет этот класс:

const tom : User = new User("Том");

Иначе говоря, константа tom представляет некоторого пользователя, у которого имя «Том».

Затем получаем элемент с id header на веб-странице в одноименную константу header :

const header = this.document.getElementById("header");

То есть этот элемент будет представлять определенный на веб-странице index.html заголовок .

Далее с помощью свойства innerHTML меняем содержимое элемента:

header.innerHTML = "Привет " + tom.name;

В данном случае свойству innerHTML передается строку, к которой добавляется значение свойства tom.name . То есть мы ожидаем, что в заголовок на веб-странице будет выводится создаваемая здесь строка.

Сохраним и скомпилируем этот файл. Для этого в командной строке/терминале с помощью команды cd перейдем к каталогу, где расположен файл app.ts (в моем случае это C:\typescript). И для компиляции выполним следующую команду:

После компиляции в каталоге проекта создается файл app.js , который будет выглядеть так:

var User = /** @class */ (function () < function User(_name) < this.name = _name; >return User; >()); var tom = new User("Том"); var header = this.document.getElementById("header"); header.innerHTML = "Привет " + tom.name;

И теперь мы можем кинуть веб-страницу index.html в браузер и увидеть результат работы написанного на TypeScript кода:

Источник

Download TypeScript

TypeScript can be installed through three installation routes depending on how you intend to use it: an npm module, a NuGet package or a Visual Studio Extension.

If you are using Node.js, you want the npm version. If you are using MSBuild in your project, you want the NuGet package or Visual Studio extension.

TypeScript in Your Project

Having TypeScript set up on a per-project basis lets you have many projects with many different versions of TypeScript, this keeps each project working consistently.

via npm

TypeScript is available as a package on the npm registry available as «typescript» .

You will need a copy of Node.js as an environment to run the package. Then you use a dependency manager like npm, yarn or pnpm to download TypeScript into your project.

npm install typescript —save-dev

All of these dependency managers support lockfiles, ensuring that everyone on your team is using the same version of the language. You can then run the TypeScript compiler using one of the following commands:

with Visual Studio

For most project types, you can get TypeScript as a package in Nuget for your MSBuild projects, for example an ASP.NET Core app.

• The Manage NuGet Packages window (which you can get to by right-clicking on a project node)
• The Nuget Package Manager Console (found in Tools > NuGet Package Manager > Package Manager Console) and then running:
  Install-Package Microsoft.TypeScript.MSBuild

For project types which don’t support Nuget, you can use the TypeScript Visual Studio extension. You can install the extension using Extensions > Manage Extensions in Visual Studio.

The examples below are for more advanced use cases.

Globally Installing TypeScript

It can be handy to have TypeScript available across all projects, often to test one-off ideas. Long-term, codebases should prefer a project-wide installation over a global install so that they can benefit from reproducible builds across different machines.

via npm

You can use npm to install TypeScript globally, this means that you can use the tsc command anywhere in your terminal.

To do this, run npm install -g typescript . This will install the latest version (currently 5.1 ).

via Visual Studio Marketplace

You can install TypeScript as a Visual Studio extension, which will allow you to use TypeScript across many MSBuild projects in Visual Studio.

Working with TypeScript-compatible transpilers

There are other tools which convert TypeScript files to JavaScript files. You might use these tools for speed or consistency with your existing build tooling.

Each of these projects handle the file conversion, but do not handle the type-checking aspects of the TypeScript compiler. So it’s likely that you will still need to keep the above TypeScript dependency around, and you will want to enable isolatedModules .

Babel

Babel is a very popular JavaScript transpiler which supports TypeScript files via the plugin @babel/plugin-transform-typescript.

swc

swc is a fast transpiler created in Rust which supports many of Babel’s features including TypeScript.

Sucrase

Sucrase is a Babel fork focused on speed for using in development mode. Sucrase supports TypeScript natively.

Next Steps

Get Started

Источник

Download TypeScript

TypeScript can be installed through three installation routes depending on how you intend to use it: an npm module, a NuGet package or a Visual Studio Extension.

If you are using Node.js, you want the npm version. If you are using MSBuild in your project, you want the NuGet package or Visual Studio extension.

TypeScript in Your Project

Having TypeScript set up on a per-project basis lets you have many projects with many different versions of TypeScript, this keeps each project working consistently.

via npm

TypeScript is available as a package on the npm registry available as «typescript» .

You will need a copy of Node.js as an environment to run the package. Then you use a dependency manager like npm, yarn or pnpm to download TypeScript into your project.

npm install typescript —save-dev

All of these dependency managers support lockfiles, ensuring that everyone on your team is using the same version of the language. You can then run the TypeScript compiler using one of the following commands:

with Visual Studio

For most project types, you can get TypeScript as a package in Nuget for your MSBuild projects, for example an ASP.NET Core app.

• The Manage NuGet Packages window (which you can get to by right-clicking on a project node)
• The Nuget Package Manager Console (found in Tools > NuGet Package Manager > Package Manager Console) and then running:
  Install-Package Microsoft.TypeScript.MSBuild

For project types which don’t support Nuget, you can use the TypeScript Visual Studio extension. You can install the extension using Extensions > Manage Extensions in Visual Studio.

The examples below are for more advanced use cases.

Globally Installing TypeScript

It can be handy to have TypeScript available across all projects, often to test one-off ideas. Long-term, codebases should prefer a project-wide installation over a global install so that they can benefit from reproducible builds across different machines.

via npm

You can use npm to install TypeScript globally, this means that you can use the tsc command anywhere in your terminal.

To do this, run npm install -g typescript . This will install the latest version (currently 5.1 ).

via Visual Studio Marketplace

You can install TypeScript as a Visual Studio extension, which will allow you to use TypeScript across many MSBuild projects in Visual Studio.

Working with TypeScript-compatible transpilers

There are other tools which convert TypeScript files to JavaScript files. You might use these tools for speed or consistency with your existing build tooling.

Each of these projects handle the file conversion, but do not handle the type-checking aspects of the TypeScript compiler. So it’s likely that you will still need to keep the above TypeScript dependency around, and you will want to enable isolatedModules .

Babel

Babel is a very popular JavaScript transpiler which supports TypeScript files via the plugin @babel/plugin-transform-typescript.

swc

swc is a fast transpiler created in Rust which supports many of Babel’s features including TypeScript.

Sucrase

Sucrase is a Babel fork focused on speed for using in development mode. Sucrase supports TypeScript natively.

Next Steps

Get Started

Источник