webpack学习之路之webpack配置Typescript

Typescript

Typescript是JS的超集。

Typescript英文官网

Typescript中文官网

Typescript-loader

在webpack中我们会使用typescript-loader来编译typescript。

1. 安装

npm i typescript ts-loader --save-dev
复制代码

或者第三方的

npm i typescript awesome-typescript-loader --save
复制代码

这个作者说利用一些缓存 和其它方式使得awesome-typescript-loader比typescript-loader更快，但它使用都是一样的。

2. 配置

typescript会有一个专门一个在项目的根目录tsconfig.jsong来配置。

3. tsconfig配置选项

配置官网地址

常用选项

• compilerOptions
• include
• exclude

webpack.config.js内容如下:

因为ts文件可能是ts或者是tsx结尾的，所以需要用到问号，表示可有可无。

tsconfig.json内容如下:

app.ts内容如下:

执行webpack打包后内容如下

愿你成为终身学习者