文章来源于网络收集而来，版权归原创者所有，如有侵权请及时联系！

TypeScript

发布于 2019-05-26 15:36:16 字数 1435 浏览 1091 评论 0 收藏 0

支援的副档名ts 及 tsx

TypeScript 是个强型别语法的 JavaScript 超集合，其可支援 ES2015+ 的功能并可编译成一般的 JavaScript。

Parcel 已内建 TypeScript 的转换，完全无需设定。

<!-- index.html -->
<html>
<body>
  <script src="./index.ts"></script>
</body>
</html>

// index.ts
import message from './message'
console.log(message)

// message.ts
export default 'Hello, world'

当你使用 React 时

若要使用 TypeScript + React + JSX，你需要：

使用 .tsx 副档名
正确地引用 React
在 tsconfig 中使用特殊选项 "jsx": "react"

完整範例：

<!-- index.html -->
<html>
<body>
  <div></div>
  <script src="./index.tsx"></script>
</body>
</html>

// index.tsx
import React from 'react'
import ReactDOM from 'react-dom'

console.log('Hello from tsx!')

ReactDOM.render(
    <p>Hello</p>,
    document.getElementById('root'),
)

// .tsconfig
{
  "compilerOptions": {
    "jsx": "react"
  }
}

详情请见此讨论串：https://github.com/parcel-bundler/parcel/issues/1199

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

列表为空，暂无数据

TypeScript

当你使用 React 时

如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。