npm i typescript -D
npm i ts-loader -D
初始化 tsconfig.json 文件
npx tsc --init
tsconfig.json 文件内容:
webpack.config.js里面的配置
注意事项:
一定记得配置: 他可以的import导入ts文件的时候省略扩展名。不然没有扩展名就找不到该文件。
extensions: ['.js', '.css', '.ts', '.tsx']
写一个 .ts 文件测试一下
引入 babel-loader
此时这个 ts 文件是用 ts-loader 编译的,在目前为止,babel-loader 也能够编译 ts 文件了,所以我们可以卸载 ts-loader,# babel7 在 webpack 中的配置 里面已经讲解了具体 babel 的配置,我们只需要在这个基础上配置就好了。
npm i @babel/preset-typescript -D
这是一个 babel 的 preset,里面包含了所有 tscript 的编译插件。
在 webpack.config.js 里面
在 tsconfig.json 里面配置
测试文件
发现不管是 ts 还是 polyfill 都运行正常。