vscode配置typescript的tsx文件模板代码

1. 首先创建模板文件Template.tsx

import React, { memo } from 'react';
import type { FC, ReactNode } from 'react'

interface IProps {
  children?: ReactNode
}

const Template: FC<IProps> = () => {
  return <div>Template</div>
}

export default memo(Template)

2、将模板文件Template.tsx复制进入snippet-generator，得到配置文件

"typescript react": {
  "prefix": "tsx",
  "body": [
    "import React, { memo } from 'react';",
    "import type { FC, ReactNode } from 'react'",
    "",
    "interface IProps {",
    "  children?: ReactNode",
    "}",
    "",
    "const Template: FC<IProps> = () => {",
    "  return <div>Template</div>",
    "}",
    "",
    "export default memo(Template)"
  ],
  "description": "typescript react"
}

3、打开vscode，点击Code，Preferences，User Snippet,搜索并打开typescriptreact.json，将配置文件复制进去，完成。