vsCode全局snippet

一、背景

以前写html，一个!回车，html的基础代码就全出来了,vscode也支持配置这样的短片段

二、步骤

找到地方

• vscode
• 左上角Code
• perferences
• User snippets
• new Global Snippets file
• 输入创建名字

配置文件

  {
      "Print to console": {
        "scope": "javascript,typescript",
        "prefix": "mySnippets",
        "body": [
          "import React,{ useState, useEffect} from 'react';",
          "import { Button } from 'antd';",
          "import styles from './index.module.less';\n",
          "const Page = () => {",
          "\tconst [data, setData] = useState('');",
          "\tuseEffect(() => {",
          "\t\tconsole.log(data,setData);",
          "\t}, [])",
          "\treturn (",
          "\t\t<Button className={styles.btn}>我是按钮</Button>",
          "\t)",
          "}\n",
          "export default Page"
        ],
        "description": "Log output to console"
      }
    }
}

接下来新建文件，在文件内输入mySnippets回车就能把以上配置的模板输出了。