本篇文章将介绍如何使用parcel工具打包TS代码。
安装parcel工具包到devDependencies。
# Yarn
yarn global add parcel-bundler
# npm/cnpm
npm install parcel-bundler -g
编写TypeScript代码。
const teacher: string = 'jake'
console.log(teacher)
在index.html中直接引入写好的TypeScript文件。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<script src="./demo7.ts"></script>
<title>Document</title>
</head>
<body>
</body>
</html>
在package.json 中配置parcel指令。
"test": "parcel ./src/index.html"
直接运行npm run test，然后查看html源码，引入的ts文件被编译成了js文件。
使用parcel工具的好处：
- 减少潜在的webpack配置项
- 会自动将html中引入的ts文件编译成浏览器能够运行的代码
- 启动一个本地服务器，将本地编译的代码返回给我们
- 实际看到的就是经过ts编译后的，可以直接运行的html文件
2549
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
