vscode格式化Vue出現的問題

崔曉明發布于2019-08-22 15:10 / 517人閱讀

摘要：一中使用插件格式化文件時，代碼會自動加上冒號和分號本來就是簡寫比較方便舒服，結果一個格式化回到解放前最后找到問題原因首先，默認設置是這個樣的。

一、VSCode中使用vetur插件格式化vue文件時，js代碼會自動加上冒號和分號

本來就是簡寫比較方便舒服，結果一個格式化回到解放前

最后找到問題原因：

  首先，vetur默認設置是這個樣的。也就是很多是用的prettier插件。

解決辦法1 (最快的解決辦法)

把"vetur.format.defaultFormatter.js": "prettier",改為 "vetur.format.defaultFormatter.js": "vscode-typescript"

參考自記一次vscode升級后，格式化Vue出現的問題

但是這樣就沒有用到Prettier這個酷酷的東西，于是自己打算繼續研究

解決辦法2 (踏實的解決辦法)

一打開Prettier官網，闊怕全是英文，還是硬著頭皮上

(1)安裝

yarn安裝

yarn add prettier --dev --exact

或者全局安裝

yarn global add prettier

或者npm(當然cnpm也可以)

npm install --save-dev --save-exact prettier

或者全局安裝

npm install --global prettier

(2)新建.prettierrc.json配置文件放在vue項目的root目錄下(也就是和README.md文件同一目錄)

(3)配置.prettierrc.json文件如下

{
    "singleQuote":true,//使用單引號而不是雙引號,true就是對
    "semi":false//在語句結尾處打印分號,false就是不打印
}

小伙伴們還想配置其他參數選項可參考官網Prettier的選項和參數描述

現在按快捷鍵Shift+Alt+f格式化js代碼就不會加上冒號和分號了。

作者相關Vue文章

基于Vue2.0實現后臺系統權限控制

前端文檔匯總

VUE2.0增刪改查附編輯添加model(彈框)組件共用

打賞衷心的表示感謝

云服務器 GPU云服務器 cdn的出現問題云主機可能出現的問題阿里云服務器容易出現的問題 extjs出現問題

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/93235.html

vscode 配置eslint 開發vue的相關配置

摘要：參考詳情請參考此插件允許和修復文件中包含的內聯腳本。這是因為中發生了許多內部更改，包括支持預處理器中自動固定的新。請確保在你的配置中使用了該插件自身的配置代碼規范解決報錯問題如何在vscode中用JavaScript Standard Style風格去驗證 vue文件實際上JavaScript Standard Style有一個FAQ, 說明了如何使用。但是有一點非常重要的作者沒有...

haobowd 2019-08-02 16:15 評論0 收藏0
vscode 配置eslint 開發vue的相關配置

摘要：參考詳情請參考此插件允許和修復文件中包含的內聯腳本。這是因為中發生了許多內部更改，包括支持預處理器中自動固定的新。請確保在你的配置中使用了該插件自身的配置代碼規范解決報錯問題如何在vscode中用JavaScript Standard Style風格去驗證 vue文件實際上JavaScript Standard Style有一個FAQ, 說明了如何使用。但是有一點非常重要的作者沒有...

lifesimple 2019-08-23 17:13 評論0 收藏0
如何在vscode中用standard style 風格去驗證 vue文件

摘要：史上最便捷的統一代碼風格的方式，輕松擁有。自動代碼格式化。提前發現風格及程序問題。減少代碼審查過程中反反復復的修改過程，節約時間。如何在中用風格去驗證文件實際上有一個說明了如何使用。 1 JavaScript Standard Style簡介本工具通過以下三種方式為你（及你的團隊）節省大量時間：無須配置。史上最便捷的統一代碼風格的方式，輕松擁有。自動代碼格式化。只需運行 s...

gnehc 2019-08-01 18:14 評論0 收藏0
如何在vscode中用standard style 風格去驗證 vue文件

摘要：史上最便捷的統一代碼風格的方式，輕松擁有。自動代碼格式化。提前發現風格及程序問題。減少代碼審查過程中反反復復的修改過程，節約時間。如何在中用風格去驗證文件實際上有一個說明了如何使用。 1 JavaScript Standard Style簡介本工具通過以下三種方式為你（及你的團隊）節省大量時間：無須配置。史上最便捷的統一代碼風格的方式，輕松擁有。自動代碼格式化。只需運行 s...

fredshare 2019-08-22 11:20 評論0 收藏0
如何優雅地使用 VSCode 來編輯 vue 文件？

摘要：注本文首發在我的個人博客最近有個項目使用了，本來一直使用的是來進行開發，可是遇到了很多問題。此外，還有很多規范是幫助我們寫出更加優雅而不容易出錯的代碼的。，終于基本搞定了，可以愉快地開發應用了。注：本文首發在我的個人博客最近有個項目使用了 Vue.js ，本來一直使用的是 PHPStorm 來進行開發，可是遇到了很多問題。后來，果斷放棄收費的 PHPStorm ，改用 vsco...

pekonchan 2019-08-20 15:14 評論0 收藏0