【taro react】---- VSCode 配置用户代码片段

Rattenking

发布于 2022-01-06 16:48:44

7730

发布于 2022-01-06 16:48:44

文章被收录于专栏：RattenkingRattenking

1. 知识点

生成用户的全局代码片段 json 文件；
快捷键生成代码片段；

2. 生成代码片段配置文件

2.1 方法一

点击【设置】
点击【用户代码片段】

2.2 方法二

点击【文件】
点击【首选项】
点击【用户片段】

3. 生成配置文件

点击【新代码片段】
输入【jsx.json】
回车生成文件【jsx.json.code-snippets】
这里生成的是全局代码片段，也可以生成针对本项目的代码片段

4. 编辑配置文件

复制一个print配置模板
prefix 是代码片段快捷输入字符
body 是输出的代码片段
description 对代码片段的说明
注意：scope 字段需要删除，否则再jsx文件中，配置的代码片段不会提示

5. 配置示例

"Print to taro react": {
		"prefix": "treact",
		"body": [
			"import React, { Component } from 'react'",
      "import { View, Text, Image } from '@tarojs/components'",
      "import RuiCustom from '../../component/RuiCustom/RuiCustom'",
      "import Taro from '@tarojs/taro'",
      "",
      "export default class $1 extends Component {",
      "  constructor(props) {",
      "    super(props)",
      "  }",
      "  state = {}",
      "",
      "  componentDidMount(){",
      "    ",
      "  }",
      "  render () {",
      "    return (",
      "      <View>",
      "        <RuiCustom title=\"$2\" showBack={true}></RuiCustom>",
      "      </View>",
      "    )",
      "  }",
      "}"
		],
		"description": "Log output to taro react!"
	}

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

原始发表：2021-10-19 ，如有侵权请联系 cloudcommunity@tencent.com 删除

编程算法