一讲竿、vscode必裝插件
1泥兰、eslint ：代碼校驗(yàn)
2、stylelint：樣式代碼校驗(yàn)
3题禀、GitLens：代碼編輯歷史人員信息
4鞋诗、Git History：當(dāng)前版本與上一版本代碼比對
5、Vetur：vue項(xiàng)目插件迈嘹，提供語法高亮削彬、校驗(yàn)等能力
6、vscode-fileheader：頁面頭部注釋快捷方式
7秀仲、Auto Rename Tag：標(biāo)簽同步更改
8融痛、Auto Close Tag：自動閉合標(biāo)簽
二、vscode配置文件
建議將下列配置項(xiàng)設(shè)置為user配置神僵，全局生效雁刷，避免每個項(xiàng)目都進(jìn)行配置。
ps：
1保礼、字體大小可以自行調(diào)整沛励，不做強(qiáng)制要求
2、fileheader的配置需要改為自己的信息炮障，不可直接復(fù)制使用
{
? ? "editor.fontSize": 16,
? ? "eslint.autoFixOnSave": true,
? ? "vetur.validation.template": false,
? ? "vetur.format.defaultFormatter.html": "js-beautify-html",
? ? "vetur.format.defaultFormatterOptions": {
? ? ? ? "js-beautify-html": {
? ? ? ? ? ? "indent_size": 4,
? ? ? ? ? ? "wrap_attributes": "force-aligned"
? ? ? ? },
? ? ? ? "prettier": {
? ? ? ? ? ? "tabWidth": 4,
? ? ? ? ? ? "printWidth": 120,
? ? ? ? ? ? "singleQuote": true,
? ? ? ? ? ? "eslintIntegration": true,
? ? ? ? ? ? "stylelintIntegration": true
? ? ? ? }
? ? },
? ? "prettier.tabWidth": 4,
? ? "prettier.singleQuote": true,
? ? "prettier.semi": true,
? ? "prettier.printWidth": 120,
? ? "files.associations": {
? ? ? ? "*.vue": "vue"
? ? },
? ? "eslint.validate": [
? ? ? ? "javascript",
? ? ? ? "javascriptreact",
? ? ? ? {
? ? ? ? ? ? "language": "vue",
? ? ? ? ? ? "autoFix": true
? ? ? ? }
? ? ],
? ? "css.validate": true,
? ? "less.validate": true,
? ? "scss.validate": true,
? ? "fileheader.LastModifiedBy": "tangliang",
? ? "fileheader.tpl": "/*\\r\\n * @Author: {author}\\r\\n * @Email: tangliang@me.com\\r\\n * @Date: {createTime}\\r\\n * @Last Modified by: {lastModifiedBy}\\r\\n * @Last Modified time: {updateTime}\\r\\n * @Description: Description\\r\\n * @Route: Route\\r\\n */\\r\\n",
? ? "fileheader.Author": "tangliang",
? ? "prettier.stylelintIntegration": true,
? ? "prettier.eslintIntegration": true,
"files.insertFinalNewline": true
}
三目派、配置方式：
1、利用command + 逗號快捷鍵打開配置頁面胁赢，如下圖：
2企蹭、選擇User欄目，點(diǎn)擊右上角的大括號智末，進(jìn)入settings.json文件练对，將上面的配置項(xiàng)粘貼進(jìn)去即可。
