开发软件的网站,深圳企业网站建设企业,延安商城网站开发设计,wordpress 导出功能背景
最近使用VSCode学习Vue项目比较频繁#xff0c;每次创建Vue文件都要手动写重复代码#xff0c;特别麻烦#xff0c;就上网查找自动生成代码的说明#xff0c;结果发现VSCode有代码模板#xff0c;怪怪#xff0c;感觉发现新大陆了(low!)。
配置 打开配置 方式一每次创建Vue文件都要手动写重复代码特别麻烦就上网查找自动生成代码的说明结果发现VSCode有代码模板怪怪感觉发现新大陆了(low!)。
配置 打开配置 方式一首先打开File-Preferences-Configure User Snippets配置文件-首选项-配置用户片段 方式二或通过快捷键CtrlShiftP打开命令面板输入snippets选择Configure User Snippets 然后选择需要配置模板的对应文件类型以vue模板为例选择vue.json其他模板同理为类型.json如 配置自定义代码模板: Print to console 代码模板内容prefix 代码模板前缀在对应类型中使用该前缀可触发根据代码模板生成代码body 代码模板数据实际是字符串数组$1,$2,$3 代码模板变量根据变量顺序从1开始$0为最后一个变量会在代码生成后输入根据次序代表变量顺序${1:default} 代码模板变量默认值当不输入时以默认值显示否则显示输入值
{{// Place your snippets for vue here. Each snippet is defined under a snippet name and has a prefix, body and // description. The prefix is what is used to trigger the snippet and the body will be expanded and inserted. Possible variables are:// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders. Placeholders with the // same ids are connected.// Example:// Print to console: {// prefix: log,// body: [// console.log($1);,// $2// ],// description: Log output to console// }Print to console:{prefix: vue,body: [template, div class${1:home}/div,/template,script,export default {, name: ${2:Home},, data() {, return {, }, },, methods: {},,};,/script,]}
}使用
配置完成后在VSCode中输入模板名称按tab键即可生成模板代码如下图所示
