TypeScript – Get Started

2022/4/28 23:12:44

编程Tag： typescript get Code index h1 youtube started

本文主要是介绍TypeScript – Get Started，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

前言

我学 TypeScript 的时候是 Angular 2.0 beta 的年代... 现在 Angular 都快 14 了.

但由于已经有 1 年半没有写 Angular 和 TypeScript 了, 所以特地写来复习 warm up 一下, 也把这些年零零散散的知识集中写一下做个记入.

参考

Youtube – TypeScript Tutorial 1 – 21 非常简单的入门

Youtube – TypeScript Course for Beginners - Learn TypeScript from Scratch! 前半段是简单入门, 后半段的 config 值得看看.

Youtube – Typescript tsconfig tutorial 教 tsconfig

开发工具

Node.js

VS Code

Live Server (VS Code Plug-in)

前端开发少不了上面 3 个, 就不多介绍了

安装

创建项目

mkdir play-typescript
cd play-typescript
yarn init

安装 typescript

npm install typescript --global
yarn add typescript -dev

一个全局, 一个本地. compile 会以本地的为标准, 全局的目的是要它的 command

Compile & Run

打开 VS Code, 创建 index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <script src="./index.js" defer></script> <!-- 关键 -->
  </head>
  <body></body>
</html>

创建 index.ts

const h1 = document.createElement("h1");
h1.appendChild(document.createTextNode("Hello World"));
document.body.appendChild(h1);

View Code

运行命令

tsc index.ts

然后就会看见 index.js 被编辑出来了.

运行 Live Server

效果

这个就是最最最基本的使用方式

这篇关于TypeScript – Get Started的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！

TypeScript – Get Started

前言

参考

开发工具

安装

Compile & Run

相关编程文章