vscode 中的 vue 格式化(一)

使用 vscode 開發 vue, 必不可少的插件包括 vetur, prettier

vetur 提供了下面一系列的功能:

Features

  • Syntax-highlighting 高亮
  • Snippet 代碼片段
  • Emmet 縮寫語法
  • Linting / Error Checking 代碼格式檢查
  • Formatting 代碼格式化
  • Auto Completion 自動補全
  • Debugging debug

這些功能挺齊全了,但是 vetur 使用的代碼格式化工具是 prettier ,所以如果不安裝 prettier 的話也是不能正常完成格式化的。

不過 prettier 的默認是 tab 佔兩個空格,不符合我的習慣,所以要改成 4 個空格。

另外 vscode 自身的 html 和 js 的格式化就已經挺符合我的習慣了,因此也改爲使用 vscode 的。

最終的設置如下:

"vetur.format.defaultFormatter.js": "vscode-typescript",

"vetur.format.defaultFormatter.html": "js-beautify-html",

"vetur.format.defaultFormatter.ts": "vscode-typescript",

"vetur.format.defaultFormatter.css": "prettier",

"prettier.disableLanguages": [],

"prettier.tabWidth": 4

配置截圖:

 

更多:

Vue element表格分頁數據加載示例

Vue element 表格獲取選中項操作

Vue element 二級菜單綁定示例

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章