一、基礎(chǔ)的
1、Auto Rename Tag?
修改標(biāo)簽會(huì)同步修改
2、Auto Import - ES6, TS, JSX, TSX
自動(dòng)查找、解析并為所有可用導(dǎo)入提供代碼操作和代碼完成。適用于 JavaScript (ES6) 和 TypeScript (TS)
3、Code Runner?
快速運(yùn)行
調(diào)試js
4、CSS Peek
跳轉(zhuǎn)對(duì)應(yīng)
css
5、DotENV
高亮ENV文件
6、Error Lens
顯示錯(cuò)誤
7、ESLint
8、GitLens — Git supercharged?
在每行代碼查看代碼是誰(shuí)修改的
9、JavaScript (ES6) code snippets
ES6代碼塊
10、jsdoc
快速生成函數(shù)注釋
11、npm Intellisense
智能npm引入 >>> 沒啥用
12、open in browser
CTRL + B 在
瀏覽器打開
13、Path Intellisense?
智能
路徑
引入
14、Prettier - Code formatter
15、Smart Click
雙擊標(biāo)簽,選中標(biāo)簽包裹的內(nèi)容
16、Tabnine AI??
代碼提示
17、Turbo Console Log
快速高效的
Console Log
18、vscode extension for ECharts
智能提示
echarts
的 options
19、vscode-element-helper
智能提示
element-ui
20、path-alias
一個(gè)可以解決路徑別名提示,跳轉(zhuǎn)的vscode插件 >>> 我測(cè)試的時(shí)候沒啥用
21、i18n Ally?
i18n插件,實(shí)時(shí)預(yù)覽,非常的好用,
記得在settings.json中配置下面的代碼
{
"i18n-ally.localesPaths": "locales",
"i18n-ally.keystyle": "nested",
"i18n-ally.sortKeys": true,
"i18n-ally.namespace": true,
"i18n-ally.enabledParsers": ["yaml", "js"],
"i18n-ally.sourceLanguage": "en",
"i18n-ally.displayLanguage": "zh-CN",
"i18n-ally.enabledFrameworks": ["vue"],
}
22、Tailwind CSS IntelliSense
智能提示
Tailwind CSS
語(yǔ)法
23、vue-helper
Vue2 組件跳轉(zhuǎn)源碼 包括 Element-UI 和 vux 和 iView,也可以比如輸入el-table,可以生成一個(gè)骨架
24、JSON to TS
Json數(shù)據(jù)一鍵轉(zhuǎn)Ts
二、Vue相關(guān)的
1、Vue 3 Snippets
這個(gè)插件基于最新的 Vue 2 及 Vue 3 的 API 添加了 Code Snippets(代碼片段)。
2、Vue VSCode Snippets
也是一個(gè)vue的代碼片段
3、vue-component
智能引入自己寫的組件 + 跳轉(zhuǎn)組件 >>> 詳情去看官方說(shuō)明
4、Vue Language Features (Volar)???
vue項(xiàng)目必開插件
注意!??!Vuter
和Volar
兩個(gè)插件不可以共同使用,否則會(huì)沖突報(bào)錯(cuò)?。?!,現(xiàn)在不管是vue2
還是vue3
都使用這個(gè)插件
5、TypeScript Vue Plugin (Volar)
Vue3項(xiàng)目使用的插件
三、美化
1、Material Icon Theme?
文件圖標(biāo)
2、Vitesse Theme???
文章來(lái)源:http://www.zghlxwxcb.cn/news/detail-776972.html
主題 >>> 推薦使用
Vitesse Dark Soft
文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-776972.html
到了這里,關(guān)于前端vscode必備插件的文章就介紹完了。如果您還想了解更多內(nèi)容,請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!