VSCode 自定义代码片段

KOOK(峰)

已于 2022-11-30 10:47:47 修改

阅读量615

点赞数

文章标签： vscode ide 编辑器

于 2022-11-30 10:46:03 首次发布

本文链接：https://blog.csdn.net/qq_45264054/article/details/128109572

版权

代码片段

代码片段是什么呢？代码片段可以理解为模板，当我们输入指令时，按下【tab】或者【enter】即可出现对应的模板。

为什么要使用代码片段呢？在开发过程中，经常会遇到一些重复使用的代码块，复制粘贴也很麻烦，这时，使用代码片段的优点就凸显出来了。

“工欲善其事，必先利其器”

Snippets 工具

官网地址：Snippets in Visual Studio Code

自定义代码片段

第一步：选择模板类型

选择需要自定义模板的类型，我这边选择的是 html

第二步：复制自己需要生成代码片段的代码

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <div id="app"></div>
</body>

</html>
<style></style>
<script src="../../dist/vue.global.js"></script>
<script>
    debugger;
    Vue.createApp({
        template: `<h2>Hello</h2>`
    }).mount('#app')
</script>