让.vue在Sublime Text新建模板内高亮

这次给大家带来让.vue在Sublime Text新建模板内高亮,让.vue在Sublime Text新建模板内高亮的注意事项有哪些,下面就是实战案例,一起来看一下。

本文介绍了 Sublime Text新建.vue模板并高亮(图文教程),分享给大家,也给自己留个笔记。

注意事项

下载注意事项新建文件模板插件 SublimeTmpl

下载安装vue语法高亮插件 Vue Syntax Highlight

Sublime Text安装插件的方法有两种:

1、使用Sublime Text自带的安装库 Package Control 去安装

点击菜单栏的 Preferences -> Package Control 或使用快捷键 CTRL+SHIFT+P 打开终端窗口,输入Install选择Package Control: Install Package来安装

2、下载直接放入包目录 (Preferences / Browse Packages) 中文:(首选项 / 包浏览器) 文件夹里面

SublimeTmpl

Vue Syntax Highlight

立即学习“前端免费学习笔记(深入)”;

创建.vue模板并让语法高亮

安装完Vue Syntax Highlight之后,你打开.vue格式的文件就已经可以高亮了,我们现在来设置用快捷键直接创建.vue格式的文件。

SublimeTmpl 默认只有6种语法模板:

html ctrl+alt+h

注意事项 ctrl+alt+j

立即学习“前端免费学习笔记(深入)”;

css ctrl+alt+c

立即学习“前端免费学习笔记(深入)”;

php ctrl+alt+p

立即学习“前端免费学习笔记(深入)”;

ruby ctrl+alt+r

立即学习“前端免费学习笔记(深入)”;

注意事项 ctrl+alt+shift+p

立即学习“前端免费学习笔记(深入)”;

我们现在新增创建 vue 格式的模板

1、创建vue文件模板

直接打开插件包的文件夹 Preferences -> Browse Packages

首选项 -> 浏览程序包

包文件夹

打开存放模板的文件夹 templates,随便复制一项,改名为vue.tmpl

创建vue.tmplvue.tmpl内容改为你想要的模板

vue.tmpl内容

2、修改新建菜单,增加新建vue选项

SublimeTmpl新建菜单默认是没有vue的,

新建 -> New File (SublimeTmpl)

点击 Menu 选项,或者打开 Preferences -> Package Settings -> SublimeTmpl -> Settings – Menu,

打开菜单配置项

复制一项,然后粘贴修改为 vue 项,

新增vue项

保存修改,就会在新建菜单里面出现vue项

出现vue项

点击上图vue新建项,就会出现之前设置的模板内容,只不过没有语法高亮,并且是纯文本格式

新建vue文件

3、模板绑定vue语法高亮

打开 Preferences -> Package Settings -> SublimeTmpl -> Settings – Default,

打开默认设置项

复制一项并修改为vue,路径如下

绑定vue语法

绑定语法关联文件路径请查看目录 Sublime Text3DataCache,寻找vue高亮语法插件名,并打开

Sublime Text3DataCache目录

Sublime Text3DataCachevue-syntax-highlight

再次菜单新建vue就语法高亮了,

新建vue文件

4、绑定新建vue文件快捷键

打开 Preferences -> Package Settings -> SublimeTmpl -> Key Bindings – Default,

打开设置快捷键文件

复制一项,粘贴创建新建vue快捷键为 ctrl+alt+v,

创建快捷键

保存后,菜单新建里也有了,

新建文件菜单

试试,完美!

最后

Preferences -> Package Settings -> SublimeTmpl -> Settings – Commands 文件好像是配置命令的,配置方法也跟上面相同,照猫画虎即可~

最后的最后

通过这种方法,其他的语言模板也可以自己去创建。

相信看了本文案例你已经掌握了方法,更多精彩请关注【创想鸟】其它相关文章!

推荐阅读:

以上就是让.vue在Sublime Text新建模板内高亮的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2771741.html

(0)
上一篇 2025年3月8日 13:03:31
下一篇 2025年2月28日 03:39:44

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • vue如何利用js等比压缩图片

    这篇文章介绍的内容是关于vue如何利用js等比压缩图片,有着一定的参考价值,现在分享给大家,有需要的朋友可以参考一下最近做一个旅游项目 大家都知道旅游项目图片居多     1.在项目中由于图片尺寸过大  再加上给图片设置了宽高导致图片压缩严…

    2025年3月8日 编程技术
    200
  • jQuery中text() val()与html()的使用有哪些区别

    这次给大家带来jQuery中text() val()与html()的使用有哪些区别,使用jQuery中text() val()与html()的注意事项有哪些,下面就是实战案例,一起来看一下。 简单的说:html()和text()的区别主要在…

    2025年3月8日
    200
  • vue中.vue文件解析步骤详解

    这次给大家带来vue中.vue文件解析步骤详解,vue中.vue文件解析的注意事项有哪些,下面就是实战案例,一起来看一下。 我们平时写的 .vue 文件称为 SFC(Single File Components),本文介绍将 SFC 解析为…

    编程技术 2025年3月8日
    200
  • VUE-地区选择器(V-Distpicker)组件的使用

    这篇文章主要介绍了关于vue-地区选择器(v-distpicker)组件的使用,有着一定的参考价值,现在分享给大家,有需要的朋友可以参考一下 废话不多说,直接进入正题。 安装,引用,这些直接从官网拷贝来的,就不多说了。 1、安装 使用 np…

    编程技术 2025年3月8日
    200
  • js 通过html()及text()方法获取并设置p标签的显示值

    这篇文章主要介绍了js 通过html()及text()方法获取并设置p标签的显示值,需要的朋友可以参考下 html()方法 此方法类似于JavaScript中的innerHTML属性,可以用来读取或者设置某个元素中的HTML内容。要获取某个…

    编程技术 2025年3月8日
    200
  • Vue实现图片轮播组件教程详解

    这次给大家带来Vue实现图片轮播组件教程详解,Vue实现图片轮播组件的注意事项有哪些,下面就是实战案例,一起来看一下。 之前一直都没有认真的写过一个组件。以前在写业务代码的过程中,都是用的别人封装好的组件,这次尝试着写了一个图片轮播组件,虽…

    2025年3月8日 编程技术
    200
  • 如何处理webstorm与.vue中es6语法报错

    这次给大家带来如何处理webstorm与.vue中es6语法报错,处理webstorm与.vue中es6语法报错的注意事项有哪些,下面就是实战案例,一起来看一下。 1.webstorm中es6语法报错,解决方法: 打开 Settings =…

    2025年3月8日 编程技术
    200
  • webstorm添加*.vue文件步骤详解

    这次给大家带来webstorm添加*.vue文件步骤详解,webstorm添加*.vue文件的注意事项有哪些,下面就是实战案例,一起来看一下。 方法1:注意事项 Vue.js 插件 打开 Settings->Plugins 搜索安装 …

    2025年3月8日
    200
  • Vue+修饰符触发事件

    这次给大家带来Vue+修饰符触发事件,Vue+修饰符触发事件的注意事项有哪些,下面就是实战案例,一起来看一下。 按键修饰符 在 PC 端开发时, 我们常常会遇到类似的需求, 比如用户按下 enter 键时提交表单, 没有用按键修饰符时, 我…

    编程技术 2025年3月8日
    200
  • vscode里使用.vue步骤详解

    这次给大家带来vscode里使用.vue步骤详解,vscode里使用.vue的注意事项有哪些,下面就是实战案例,一起来看一下。 1.设置.vue模板 打开注意事项,点击文件 —— 首选项 —— 用户代码片段,会弹出来一个输入框。 在输入框输…

    2025年3月8日
    200

发表回复

登录后才能评论