資訊專欄INFORMATION COLUMN
摘要：對(duì)文件提供語(yǔ)法高亮和自動(dòng)補(bǔ)全對(duì)小程序文件提供補(bǔ)全和語(yǔ)法高亮只需要鍵入就會(huì)有微信的提示使用做路徑感知當(dāng)我們?cè)陧?xiàng)目中集成的時(shí)候，經(jīng)常會(huì)使用。
在日常開發(fā)中，我使用的編輯器是 VS CODE。不僅界面簡(jiǎn)潔好看，而且插件豐富，是前端開發(fā)的首選工具之一。這些插件和工具的目的是為了提高我們的開發(fā)效率，下面就我日常開發(fā)切身使用到和感受到有幫助的插件和方法做個(gè)總結(jié)。
VS CODE 常用的個(gè)人在用的插件
Chinese (Simplified) Language Pack for Visual Studio Code
為 vscode 提供中文界面
EditorCofig for VS Code
給 VS Code 項(xiàng)目應(yīng)用全局的.editorconfig 設(shè)置，包括 Tab 空格數(shù)量，文件結(jié)尾符號(hào)等
Gitconfig Syntab
為.gitconfig, .gitattributes, .gitmodules 提供語(yǔ)法高亮
Mocha sidebar
macha 測(cè)試框架的 VS Code 支持
Path Intellisense
對(duì).js 文件提供路徑感知，提示功能。如何在.vue 文件中提供路徑感知
只設(shè)置在工作區(qū)設(shè)置的話，只對(duì)當(dāng)前工作區(qū)有效。
TODO Hightlight
TODO highlight.
Vetur
對(duì).vue 文件提供語(yǔ)法高亮和自動(dòng)補(bǔ)全
vscode wxml
對(duì)小程序.wxml 文件提供補(bǔ)全和語(yǔ)法高亮
vscode weapp api
只需要鍵入wx就會(huì)有微信api的提示
當(dāng)我們?cè)陧?xiàng)目中集成 webpack 的時(shí)候，經(jīng)常會(huì)使用 webpack alias。在 VS Code 中，支持 alias,需要使用jsconfig.json。
很可惜，這個(gè)方法在.vue 文件中不支持，目前沒(méi)有找到解決方案。不過(guò)我們可以使用上面的path intellisense插件來(lái)做路徑提示。
如何使用 jsconfig.json 讓 vscod 對(duì) js 文件提供路徑感知
{
"compilerOptions": {
"target": "es2017",
"allowSyntheticDefaultImports": false,
"baseUrl": "./",
"paths": {
"@/*": [ "src/apps/*" ],
"app/*": [ "src/apps/*" ],
"Components/*": [ "src/components/*" ],
"services/*": [ "src/services/*" ],
"style/*": [ "src/style/*" ]
}
},
"exclude": [
"node_modules",
"dist",
".nyc_output",
"build",
"coverage"
]
}
解決 path intellisense 插件對(duì)‘/’的不支持
我們?cè)?vscode 中設(shè)置 path intellisense 對(duì)"/"的支持
"path-intellisense.mappings": {
"/": "${workspaceRoot}",
"@": "${workspaceRoot}/src"
}
其中/ 和 vscode 本身的路徑提示沖突，在這種情況下只會(huì)基于當(dāng)前文件盤為根目錄，需要關(guān)閉 vscode 本身對(duì) js 代碼 import 的智能提示(version 1.30.2)
{
"javascript.suggest.paths": false
}
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://specialneedsforspecialkids.com/yun/108917.html
摘要：由于本身不能個(gè)性化配置，有時(shí)可能會(huì)引起不適，但是至少保證團(tuán)隊(duì)成員可以輕易統(tǒng)一代碼風(fēng)格。就是將多于一個(gè)字母的合成一個(gè)字形。自從年雙十一正式上線，累計(jì)處理了億錯(cuò)誤事件，得到了金山軟件等眾多知名用戶的認(rèn)可。 譯者按： IDE是生產(chǎn)力的保證！ 原文：Visual Studio Code Settings and Extensions for Faster JavaScript Develop...
摘要：軟件跨平臺(tái)支持以及，運(yùn)行流暢，可謂是微軟的良心之作微軟有這個(gè)宇宙最強(qiáng)，自然也不會(huì)弱宇宙最強(qiáng)編輯器說(shuō)到代碼編輯器，我們有必要提一提還有。 原文鏈接：VS Code上手與超實(shí)用插件安利 工欲善其事必先利其器 Visual Studio Code (簡(jiǎn)稱 VS Code / VSC) 是一款免費(fèi)開源的現(xiàn)代化輕量級(jí)代碼編輯器，支持幾乎所有主流的開發(fā)語(yǔ)言的語(yǔ)法高亮、智能代碼補(bǔ)全、自定義熱鍵、括號(hào)...
摘要：作為程序員，我們肯定會(huì)要選擇代碼編輯器，這里老蔣最近也準(zhǔn)備重拾代碼寫點(diǎn)東西。既然這篇文章中提到和編輯器哪個(gè)好的問(wèn)題，這里老蔣談?wù)勎业膫€(gè)人看法，畢竟我之前一直有在使用編輯器的，這個(gè)比較適合輕量級(jí)的用途的，比如簡(jiǎn)單的程序修改。作為程序員，我們肯定會(huì)要選擇代碼編輯器，這里老蔣最近也準(zhǔn)備重拾代碼寫點(diǎn)東西。本來(lái)電腦里是有安裝Sublime編輯器的，但是發(fā)現(xiàn)不清楚怎么情況自動(dòng)升級(jí)導(dǎo)致需要提交序列號(hào)才可以...
摘要：有限制就不靈活了，看源碼文件，兩百多個(gè)源碼文件都是語(yǔ)法，文件名稱是，想在中直接啟動(dòng)調(diào)式是不行的，還是需要用到才行。使用環(huán)境調(diào)式使得效率更高，直接再中閱讀源碼，直接調(diào)式看效果。 文章首發(fā)：https://github.com/giscafer/g... 前言 node.js在 v8.5 版本之后可以直接支持ES6模塊，但是有個(gè)限制就是，需要為.mjs后綴的文件才行，比如有個(gè)es6代碼文件...
摘要：個(gè)人還是更加習(xí)慣于斷點(diǎn)調(diào)試。這篇文章將介紹如何配置和來(lái)完成直接在斷點(diǎn)調(diào)試代碼并且在的調(diào)試窗口看到中相同的值。現(xiàn)在就可以在文件的代碼中打斷點(diǎn)進(jìn)行調(diào)試了。 很多人習(xí)慣在 Chrome 的調(diào)試窗口中調(diào)試 Vue 代碼， 或者直接使用 console.log 來(lái)觀察變量值， 這是非常痛苦的一件事，需要同時(shí)打開至少 3 個(gè)窗體。個(gè)人還是更加習(xí)慣于斷點(diǎn)調(diào)試。這篇文章將介紹如何配置 Visual S...
閱讀 1470·2019-08-30 15:55
閱讀 1172·2019-08-30 15:52
閱讀 1281·2019-08-29 13:53
閱讀 1465·2019-08-29 11:19
閱讀 2964·2019-08-26 13:29
閱讀 526·2019-08-26 11:33
閱讀 2586·2019-08-23 17:20
閱讀 1021·2019-08-23 14:14
