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