vscode格式化Vue出現的問題
一、VSCode中使用vetur外掛格式化vue檔案時，js程式碼會自動加上冒號和分號
本來就是簡寫比較方便舒服，結果一個格式化回到解放前
最後找到問題原因：
首先，vetur預設設定是這個樣的。也就是很多是用的prettier外掛。
解決辦法1 (最快的解決辦法)
把”vetur.format.defaultFormatter.js”: “prettier”,改為 “vetur.format.defaultFormatter.js”: “vscode-typescript”
但是這樣就沒有用到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就是不列印
}現在按快捷鍵Shift+Alt+f格式化js程式碼就不會加上冒號和分號了。
作者相關Vue文章
打賞 衷心的表示感謝
相關推薦
vscode格式化Vue出現的問題
一、VSCode中使用vetur外掛格式化vue檔案時，js程式碼會自動加上冒號和分號 本來就是簡寫比較方便舒服，結果一個格式化回到解放前 最後找到問題原因： 首先，vetur預設設定是這個樣的。也就是很多是用的prettier外掛。
解決vscode格式化vue檔案出現的問題
遇到的問題 使用vscode開發vue專案的時候，格式化vue檔案，與自己配置的eslint標準會有衝突。 引號問題：單引號變雙引號 分號問題：行末是否加分號。自動加/減分號 當然還會有其他個性化衝突，只需要找到怎麼修改，就好辦了。 說明 vscode格式化檔案，使用的是快捷鍵shift + alt +
vscode格式化vue檔案
使用vscode編寫vue檔案的時候，發現不能格式化，手動格式化程式碼，太費勁，還有可能會出錯，不格式化，有的時候程式碼編寫的時候，沒有很好的管理格式，不美觀。vscode格式化vue程式碼，讓vue程式碼更美觀，是可以做到的。我們開啟vscode的配置檔案，搜尋vetur.
vscode 格式化vue外掛wpy-beautify 快捷鍵ctrl+shift+6
vscode 格式化vue外掛wpy-beautify Features Beautify Vue or wpy code in Visual Studio Code. preview Usage Keyboard Shortcut: ctrl+shi
vscode 如何格式化vue(template)html程式碼 , 保持標籤屬性不換行
開啟vscode的 》檔案 》 首選項 》設定 找到vetur 這個選項裡面的 vetur.format.defaultFormatter.html 這個選項 將其設定為 js-beautify-html 前提是你必須安裝了這兩個外掛 然後重新載入格式化的時候就不會在格式化ht
vscode中使用beautify外掛格式化vue檔案(自定義快捷鍵)
1. 先安裝外掛beautify 2. 開啟設定 => 搜尋 beautify.language 3. 配置 json 就行了 具體使用(可忽略,可不配置) 1.在工作目錄下
sublime Text3支持vue高亮，sublime Text3格式化Vue
-m css bsp 用戶 strong 是把 思路 9.png 文件 第一：讓sublime Text3支持Vue高亮 PS:我的sublime版本是3126，我不清楚其它版本的是不是這樣設置，不過可以看看思路自己摸索下 1.下載可以讓vue格式高亮的插件vue-synt
vscode中vue代碼顏色插件
text 曾經 coder 技術分享 tell 語法 跳轉 刪除文件 顯示 vue提示插件【Vscode】 編者寄語：vscode的確是前端開發中很好的工具，安裝顏色插件，從視覺上是美的享受。曾經的我遇到了vscode代碼全是灰色，黑色的困惑，後來整理找到方法，
VScode開發Vue項目，關閉eslint代碼檢查，以及相關配置
img image http com false span inf lin bubuko 剛開始打開vue項目的時候會發現vue代碼報紅，解決方式如下 首先安裝Vetur和ESLint 打開文件》首選項》設置，配置如下代碼 { "explorer
重啟vue出現兩個bug，一個是element-ui樣式檔案不存在，另一個是vue-style-loader!css-loader?
These dependencies were not found: * element-ui/lib/theme-default/index.css in ./src/main.js * !!vue-style-loader!css-loader?{"sourceMap":true}
VScode格式化ESlint
開啟 檔案-首選項- 設定 mac可以按快捷鍵（command和，） 然後在右上角的省略號選擇open setting json { // vscode預設啟用了根據檔案型別自動設定tabsize的選項 "editor.detectIndentation": false, //
使用vscode開發vue cli 3專案，配置eslint以及prettier
初始化專案時選擇eslint-config-standard作為程式碼檢測規範，vscode安裝ESLint和Prettier - Code formatter兩個外掛，並進行如下配置 { "editor.formatOnPaste": true, "editor.formatOnSave"
vs code 格式化vue 全部外掛
1、安裝vetur 、prettier 不然無法格式化的，然後設定單引號，加方法隔空 { "vetur.format.defaultFormatter.js": "vscode-typescript", "vetur.format.defaultFormat
vscode 的vue專案配置
{ "eslint.enable": true, "eslint.autoFixOnSave": true, "eslint.run": "onType", "eslint.options": { "extensions": [".js",".vue"] }, "es
用vscode開發vue.js專案
一、安裝node.js 首先需要安裝node環境，可以直接到中文官網http://nodejs.cn/下載安裝包。 安裝完成後，可以命令列工具中輸入node -v 和 npm -v，如果能顯示出版本號就安裝成功。 二、安裝vue-cli 安裝好node，我們可以直接
VsCode + node+ vue.js 開發環境搭建（一）
1.安裝最新的 vscode ,這個很容易安裝。 2.要在機器上開發 vue.js 有兩種模式，一種直接用 .js ,這種方式不用 安裝.node 環境，另一種用 webpack, 3.在機器安裝 node node-v10.8.0-x64.msi,在安裝過程中可能會出
vsCode編輯Vue.js目錄結構分析
Vue.js 目錄結構 目錄解析 目錄/檔案 說明 build 專案構建(webpack)相關程式碼 config 配置目錄，包括埠號等。我們初學可以使用預設的。 node_modules npm 載入的專案依賴模組 src： 這裡是我們要開發的目錄，基本上要
Centos7 yum安裝nginx,vscode配置vue開發環境
建議在centos和ubuntu中使用yum或者apt-get安裝軟體： 安裝yum源 sudo rpm -Uvh http://nginx.org/packages/centos/7/noarch/RPMS/nginx-release-centos-7-0.el7.ngx.no
vscode中vue程式碼顏色外掛
vue提示外掛【Vscode】 編者寄語：vscode的確是前端開發中很好的工具，安裝顏色外掛，從視覺上是美的享受。曾經的我遇到了vscode程式碼全是灰色，黑色的困惑，後來整理找到方法，整理這篇，以下高亮外掛，建議大家都安裝了。 在VSCode Marketplace 搜素V
vscode開發vue首選項配置及常用外掛擴充套件
vsCode首選項配置 1.進入vscode頁面，點選設定開啟開使用者設定或者點選檔案》首選項進入該頁面 2.如果進入為上述頁面，找不到setting.json檔案，可通過ctrl+shift+p快捷鍵，在搜尋欄輸入preferences:open settings(json) 3.