欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

詳解vue保存自動格式化換行

 更新時間:2021年12月14日 17:15:43   作者:zailaisanwan  
這篇文章主要為大家介紹了vue保存自動格式化換行,具有一定的參考價值,感興趣的小伙伴們可以參考一下,希望能夠給你帶來幫助

網(wǎng)上找了好多方法改著也沒用,后面從一個大佬上看到的,就摘下來了,字體的話還是原來系統(tǒng)自帶的看著舒服,就自己添加上去了,需要改動的可自行修改,在右上角文件--首選項--設置--搜索setting---在setting.json編輯,把其他的注釋掉,換上下面的代碼塊就可以了,字體大小和行高可自行修改

{
  //設置文字大小
  "editor.fontSize": 18,
  //設置文字行高
  "editor.lineHeight": 20,
  //開啟行數(shù)提示
  "editor.lineNumbers": "on",
  // 在輸入時顯示含有參數(shù)文檔和類型信息的小面板。
  "editor.parameterHints.enabled": true,
  // 調(diào)整窗口的縮放級別
  "window.zoomLevel": 0,
  // 文件目錄
  // "workbench.iconTheme": "vscode-icons",
  // 設置字體
  "editor.fontFamily": "'Consolas','Droid Sans Mono', 'Courier New', monospace, 'Droid Sans Fallback'",
  // 自動換行
  "editor.wordWrap": "on",
  // 自定義vscode面板顏色
  "workbench.colorCustomizations": {
    // "tab.activeBackground": "#253046", // 活動選項卡的背景色
    // "activityBar.background": "#253046", //活動欄背景色
    // "sideBar.background": "#253046", //側(cè)邊欄背景色
    // "activityBar.foreground": "#23f8c8", //活動欄前景色(例如用于圖標)
    "editor.background": "#292a2c" //編輯器背景顏色
  },
  // vscode默認啟用了根據(jù)文件類型自動設置tabsize的選項
  "editor.detectIndentation": false,
  // 重新設定tabsize
  "editor.tabSize": 2,
  // #每次保存的時候自動格式化
  "editor.formatOnSave": true,
  //  #讓函數(shù)(名)和后面的括號之間加個空格
  "javascript.format.insertSpaceBeforeFunctionParenthesis": true,
  // #這個按用戶自身習慣選擇
  "vetur.format.defaultFormatter.html": "js-beautify-html",
  // #讓vue中的js按編輯器自帶的ts格式進行格式化
  "vetur.format.defaultFormatter.js": "vscode-typescript",
  // 保存時運行的代碼ESLint操作類型。
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
  },
  // 添加emmet支持vue文件
  "emmet.includeLanguages": {
    "wxml": "html",
    "vue": "html"
  },
  // 兩個選擇器中是否換行
  "minapp-vscode.disableAutoConfig": true,
  //快速預覽(右側(cè))
  "editor.minimap.enabled": true,
  // tab 代碼補全
  "files.associations": {
    "*.wpy": "vue",
    "*.vue": "vue",
    "*.cjson": "jsonc",
    "*.wxss": "css",
    "*.wxs": "javascript"
  },
  // 用來配置如何使用ESLint CLI引擎API啟動ESLint。 默認為空選項
  "eslint.options": {
    "extensions": [
      ".js",
      ".vue"
    ]
  },
  // 在onSave還是onType時執(zhí)行l(wèi)inter。默認為onType。
  "eslint.run": "onSave",
  // 啟用ESLint作為已驗證文件的格式化程序。
  "eslint.format.enable": true,
  // 語言標識符的數(shù)組,為此ESLint擴展應被激活,并應嘗試驗證文件。
  "eslint.probe": [
    "javascript",
    "javascriptreact",
    "vue-html",
    "vue",
    "html"
  ],
  //關閉rg.exe進程 用cnpm導致會出現(xiàn)rg.exe占用內(nèi)存很高
  "search.followSymlinks": false,
  // 給js-beautify-html設置屬性隔斷
  "vetur.format.defaultFormatterOptions": {
    "js-beautify-html": {
      "wrap_attributes": "auto",
      "wrap_line_length": 200,
      "end_with_newline": false
    },
    "prettyhtml": {
      "printWidth": 200,
      "singleQuote": false,
      "wrapAttributes": false,
      "sortAttributes": false
    },
    "prettier": {
      "semi": false,
      "singleQuote": true
    }
  },
  // style默認偏移一個indent
  "vetur.format.styleInitialIndent": true,
  // 定義匿名函數(shù)的函數(shù)關鍵字后面的空格處理。
  "javascript.format.insertSpaceAfterFunctionKeywordForAnonymousFunctions": true,
  // 定義函數(shù)參數(shù)括號前的空格處理方式。
  "typescript.format.insertSpaceBeforeFunctionParenthesis": true,
  // 新版本消息
  "vsicons.dontShowNewVersionMessage": true,
  // 控制資源管理器是否在把文件刪除到廢紙簍時進行確認。
  "explorer.confirmDelete": true,
  // 使用eslint-plugin-vue驗證<template>中的vue-html
  "vetur.validation.template": false,
  // 指定用在工作臺中的顏色主題。
  // "workbench.colorTheme": "One Dark Pro"
}

總結(jié)

本篇文章就到這里了,希望能夠給你帶來幫助,也希望您能夠多多關注腳本之家的更多內(nèi)容!

相關文章

  • 淺析Vue.js中$emit和$on的用法和區(qū)別

    淺析Vue.js中$emit和$on的用法和區(qū)別

    在?Vue.js?中,$emit和$on方法是兩個常用的方法,用于實現(xiàn)組件間的通信,雖然它們的名字很相似,但它們的作用和用法有所不同,本文將介紹$emit和$on方法的區(qū)別,并通過代碼示例來說明它們的用法,感興趣的朋友可以參考下
    2023-07-07
  • vue form check 表單驗證的實現(xiàn)代碼

    vue form check 表單驗證的實現(xiàn)代碼

    這篇文章主要介紹了vue form check 表單驗證的實現(xiàn)代碼,代碼簡單易懂,非常不錯,具有一定的參考借鑒價值,需要的朋友可以參考下
    2018-12-12
  • 關于Vue3過渡動畫的踩坑記錄

    關于Vue3過渡動畫的踩坑記錄

    在開發(fā)中我們想要給一個組件的顯示和消失添加某種過渡動畫,可以很好的增加用戶體驗,下面這篇文章主要給大家介紹了關于Vue3過渡動畫踩坑的相關資料,需要的朋友可以參考下
    2021-12-12
  • Vue組件通信的幾種實現(xiàn)方法

    Vue組件通信的幾種實現(xiàn)方法

    這篇文章主要介紹了Vue組件通信的幾種實現(xiàn)方法,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧
    2019-04-04
  • vue 集成jTopo 處理方法

    vue 集成jTopo 處理方法

    這篇文章主要介紹了vue 集成jTopo 處理方法,非常不錯,具有一定的參考借鑒價值 ,需要的朋友可以參考下
    2019-08-08
  • vue.js整合mint-ui里的輪播圖實例代碼

    vue.js整合mint-ui里的輪播圖實例代碼

    這篇文章主要介紹了vue.js整合mint-ui里的輪播圖的方法,首先我們需要初始化vue項目,然后安裝mint-ui。具體內(nèi)容詳情大家通過學習
    2017-12-12
  • vue?鼠標移入移出(hover)切換顯示圖片問題

    vue?鼠標移入移出(hover)切換顯示圖片問題

    這篇文章主要介紹了vue?鼠標移入移出(hover)切換顯示圖片問題,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教
    2022-10-10
  • Vue3中createWebHistory和createWebHashHistory的區(qū)別詳析

    Vue3中createWebHistory和createWebHashHistory的區(qū)別詳析

    這篇文章主要給大家介紹了關于Vue3中createWebHistory和createWebHashHistory區(qū)別的相關資料,文中通過實例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下
    2023-06-06
  • vue項目實現(xiàn)webpack配置代理,解決跨域問題

    vue項目實現(xiàn)webpack配置代理,解決跨域問題

    這篇文章主要介紹了vue項目實現(xiàn)webpack配置代理,解決跨域問題,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教
    2022-04-04
  • element日期組件實現(xiàn)只能選擇小時或分鐘

    element日期組件實現(xiàn)只能選擇小時或分鐘

    本文主要介紹了element日期組件實現(xiàn)只能選擇小時或分鐘,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧
    2023-01-01

最新評論