VScode快速一键生成html、vue、jsx、ajax、sass、docker等代码片段

Simon 发布于2019-08-21 18:31 / 1353人阅读

摘要：学会添加自定义代码段就可以极大的提高你的开发效率文件首选项用户代码片段选择你需要新建的代码片段的语言进入代码片段编辑界面所有的代码片段需要用或包裹表示制表符空的一行必须用或包裹代表光标第一次出现的位置，代表按下后光标第二次出现的位置一个简单

学会添加自定义snippet（代码段）就可以极大的提高你的开发效率

1.文件 => 首选项 => 用户代码片段

2.选择你需要新建的代码片段的语言

3.进入代码片段编辑界面

1. 所有的代码片段需要用""或""包裹
2. 	表示制表符
3. 空的一行必须用""或""包裹
4. $1代表光标第一次出现的位置，$2代表按下tab后光标第二次出现的位置

4.一个简单地.jsx demo

{
    "JSX": {
        "prefix": "jsx", // 触发的关键字 输入jsx按下tab键
        "body": [
            "import React from "react"",
            "",// 空的一行
            "class Demo extends React.Component {",
            "	render() {", // 有制表符的一行
            "		return (",
            "			$1",    // 光标首次出现的位置            
            "		)",
            "	}",
            "}",
            "",
            "export default Demo",
        ],
        "description": "jsx components"
    }
}

5.demo

备注：官方文档 https://code.visualstudio.com...

idc机房托管私有云代码片段添加代码片段 Python代码片段 BootStrap代码片段

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/90550.html

VS Code配置及插件推荐

摘要：宋体以像素为单位控制字号。将其设置为可隐藏窗格。是否已启用自动刷新是否启用自动拉取以像素为单位控制终端的字号，这是的默认值。要求工作区使用高于版本的。用户设置打开文件 > 首选项 > 用户设置(U)，（忽略覆盖工作区提示） { // 一个制表符等于的空格数。该设置在 `editor.detectIndentation` 启用时根据文件内容进行重写。 editor.tabS...

wpw 2019-08-20 14:42 评论0 收藏0
前端开发VScode常用插件

摘要：名称功能自动闭合标签自动提示修改标签时，自动修改匹配的标签格式化编写更加人性化的注释添加行书签的浏览器兼容性检查运行选中代码段支持大量语言，包括单词拼写检查在中弹出浏览器并搜索，可编辑搜索引擎颜色值在代码中高亮显示小窗口显示颜色值，等等拾色名称功能 Auto Close Tag 自动闭合HTML标签 Auto Import...

hellowoody 2019-08-21 18:21 评论0 收藏0
vscode常用插件【全了】

摘要：插件集待补充。。。同时，它还包含了用于转换为格式和生成数据模式的选项用于压缩合并和文件的应用程序。它提供了大量自定义的设置，以及自动压缩保存并导出为文件的选项。修改文本的更多命名格式，包括驼峰命名下划线分隔命名，命名以及命名等切换漂亮的主题插件集待补充。。。 20180903 文件【Path Intellisense】自动补全路径浏览器【Open-In-Browser】在...

kyanag 2019-08-30 13:57 评论0 收藏0
vscode常用插件【全了】

摘要：插件集待补充。。。同时，它还包含了用于转换为格式和生成数据模式的选项用于压缩合并和文件的应用程序。它提供了大量自定义的设置，以及自动压缩保存并导出为文件的选项。修改文本的更多命名格式，包括驼峰命名下划线分隔命名，命名以及命名等切换漂亮的主题插件集待补充。。。 20180903 文件【Path Intellisense】自动补全路径浏览器【Open-In-Browser】在...

xcc3641 2019-08-26 11:42 评论0 收藏0