SublimeText新建.vue模板并高亮(圖文教程)

本文介紹了 Sublime Text新建.vue模板并高亮(圖文教程)，分享給大家，也給自己留個(gè)筆記。

創(chuàng)新互聯(lián)建站提供成都網(wǎng)站建設(shè)、網(wǎng)站設(shè)計(jì)、網(wǎng)頁設(shè)計(jì)，品牌網(wǎng)站制作，廣告投放等致力于企業(yè)網(wǎng)站建設(shè)與公司網(wǎng)站制作，10余年的網(wǎng)站開發(fā)和建站經(jīng)驗(yàn),助力企業(yè)信息化建設(shè)，成功案例突破上千家,是您實(shí)現(xiàn)網(wǎng)站建設(shè)的好選擇.

準(zhǔn)備工作

1. 下載安裝新建文件模板插件 SublimeTmpl
2. 下載安裝vue語法高亮插件 Vue Syntax Highlight

Sublime Text安裝插件的方法有兩種：

1、使用Sublime Text自帶的安裝庫 Package Control 去安裝

點(diǎn)擊菜單欄的 Preferences -> Package Control 或使用快捷鍵 CTRL+SHIFT+P 打開終端窗口，輸入Install選擇Package Control: Install Package來安裝

2、下載直接放入包目錄 (Preferences / Browse Packages) 中文:(首選項(xiàng) / 包瀏覽器) 文件夾里面

1. SublimeTmpl
2. Vue Syntax Highlight

創(chuàng)建.vue模板并讓語法高亮

安裝完Vue Syntax Highlight之后，你打開.vue格式的文件就已經(jīng)可以高亮了，我們現(xiàn)在來設(shè)置用快捷鍵直接創(chuàng)建.vue格式的文件。

SublimeTmpl 默認(rèn)只有6種語法模板：

1. html ctrl+alt+h
2. javascript ctrl+alt+j
3. css ctrl+alt+c
4. php ctrl+alt+p
5. ruby ctrl+alt+r
6. python ctrl+alt+shift+p

我們現(xiàn)在新增創(chuàng)建 vue 格式的模板

1、創(chuàng)建vue文件模板

直接打開插件包的文件夾 Preferences -> Browse Packages

首選項(xiàng) -> 瀏覽程序包

包文件夾

打開存放模板的文件夾 templates，隨便復(fù)制一項(xiàng)，改名為vue.tmpl

創(chuàng)建vue.tmplvue.tmpl內(nèi)容改為你想要的模板

vue.tmpl內(nèi)容

2、修改新建菜單，增加新建vue選項(xiàng)

SublimeTmpl新建菜單默認(rèn)是沒有vue的，如圖

新建 -> New File (SublimeTmpl)

點(diǎn)擊上圖的 Menu 選項(xiàng)，或者打開 Preferences -> Package Settings -> SublimeTmpl -> Settings - Menu，如圖

打開菜單配置項(xiàng)

復(fù)制一項(xiàng)，然后粘貼修改為 vue 項(xiàng)，如圖

新增vue項(xiàng)

保存修改，就會在新建菜單里面出現(xiàn)vue項(xiàng)，如圖

出現(xiàn)vue項(xiàng)

點(diǎn)擊上圖vue新建項(xiàng)，就會出現(xiàn)之前設(shè)置的模板內(nèi)容，只不過沒有語法高亮，并且是純文本格式，如圖

新建vue文件

3、模板綁定vue語法高亮

打開 Preferences -> Package Settings -> SublimeTmpl -> Settings - Default，如圖

打開默認(rèn)設(shè)置項(xiàng)

復(fù)制一項(xiàng)并修改為vue，路徑如下

綁定vue語法

綁定語法關(guān)聯(lián)文件路徑請查看目錄 Sublime Text3\Data\Cache，尋找vue高亮語法插件名，并打開，如圖

Sublime Text3\Data\Cache目錄

Sublime Text3\Data\Cache\vue-syntax-highlight

再次菜單新建vue就語法高亮了，如圖

新建vue文件

4、綁定新建vue文件快捷鍵

打開 Preferences -> Package Settings -> SublimeTmpl -> Key Bindings - Default，如圖

打開設(shè)置快捷鍵文件

復(fù)制一項(xiàng)，粘貼創(chuàng)建新建vue快捷鍵為 ctrl+alt+v，如圖

創(chuàng)建快捷鍵

保存后，菜單新建里也有了，如圖

新建文件菜單

試試，完美！

完美

最后

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

最后的最后

通過這種方法，其他的語言模板也可以自己去創(chuàng)建。

以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持創(chuàng)新互聯(lián)。

分享標(biāo)題：SublimeText新建.vue模板并高亮(圖文教程)
標(biāo)題鏈接：http://m.kartarina.com/article42/jeohhc.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供商城網(wǎng)站、手機(jī)網(wǎng)站建設(shè)、小程序開發(fā)、品牌網(wǎng)站制作、移動網(wǎng)站建設(shè)、網(wǎng)站維護(hù)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)