前端setting.json配置

1,313 阅读1分钟

前端setting.json配置

方案1:

{
    // prettier 的配置文件存放路径
# "prettier.configPath": "~/.prettierrc",
    // ---------------------------------------
    // 编辑器中文字的大小
    "editor.fontSize": 15,
    // 代码的行高,一般都是字体大小的2倍,看起来比较舒服
    // "editor.lineHeight": 36,
    // 代码缩进使用2个空格,不要使用4个空格
    "editor.tabSize": 2,
    // ---------------------------------------
    // 导入模块时包含模块的后缀名
    "path-autocomplete.extensionOnImport": true,
    // 路径提示
    "path-autocomplete.pathMappings": {
      "@": "${folder}/src"
    },
    // ---------------------------------------
    // 开启编辑器的保存自动格式化功能
    "editor.formatOnSave": true,
    // ESLint 插件的配置
    "editor.codeActionsOnSave": {
      "source.fixAll": true
    },
    "eslint.alwaysShowStatus": true,
    // ---------------------------------------
 
    // 设置 .vue 文件中,HTML代码的格式化插件
    "vetur.format.defaultFormatter.html": "js-beautify-html",
    // 忽略警告信息
    "vetur.ignoreProjectWarning": true,
    // 防止自动导入
    "vetur.completion.autoImport": false,
    // 不验证 .vue 组件的模板结构
    "vetur.validation.template": false,
    // vetur 默认的格式化配置项
    "vetur.format.defaultFormatterOptions": {
        // vetur 默认的格式化配置项
      "prettier": {
        "trailingComma": "none",
        "semi": false,// 句尾添加分号
        "singleQuote": true, // 使用单引号替换双引号
        "printWidth": 300, // 每行文字个数超出此限制将会被迫换行
            "tabWidth": 2,
            "useTabs": false,
            "proseWrap": "never",
            "bracketSpacing": true, // 在对象,数组括号与文字之间加空格 "{ foo: bar }"
            "jsxBracketSameLine": false,
            "arrowParens": "avoid", //  (x) => {} 箭头函数参数只有一个时是否要有小括号。avoid:省略括号
            "insertPragma": false,
            "vueIndentScriptAndStyle": true,
            "quoteProps": "as-needed",
            "jsxSingleQuote": false, // jsx单引号
            "requirePragma": false,
            "htmlWhitespaceSensitivity": "strict",
            "endOfLine": "lf",
      },
      "editor.formatOnSave": true,
      "editor.codeActionsOnSave": {
        "source.fixAll.eslint": true
      },
      "js-beautify-html": {
        "wrap_attributes": false
      }
    },
    // ---------------------------------------
    "[vue]": {
      "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "[javascript]": {
      "editor.defaultFormatter": "vscode.typescript-language-features"
    },
   // 对json文件,使用 vscode内置JSON语言功能 进行格式化
    "[json]": {
      "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "[html]": {
      "editor.defaultFormatter": "vscode.html-language-features"
    },
    "[css]": {
      "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "[less]": {
      "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "[scss]": {
      "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "[markdown]": {
      "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    // 颜色主题设置
    "workbench.colorTheme": "Abyss",
    // 控制字符串中的字符是否也应进行 unicode 突出显示。
    "editor.unicodeHighlight.includeStrings": false,

    // 格式化stylus, 需安装Manta's Stylus Supremacy插件
  "stylusSupremacy.insertColons": true, // 是否插入冒号
  "stylusSupremacy.insertSemicolons": true, // 是否插入分好
  "stylusSupremacy.insertBraces": true, // 是否插入大括号
  "stylusSupremacy.insertNewLineAroundImports": false, // import之后是否换行
  "stylusSupremacy.insertNewLineAroundBlocks": false,
  "javascript.format.insertSpaceAfterConstructor": true,
  "vetur.format.defaultFormatter.js": "vscode-typescript",
  "javascript.format.insertSpaceBeforeFunctionParenthesis": true,// #让函数(名)和后面的括号之间加个空格
  "gitlens.gitCommands.skipConfirmations": [
    "fetch:command",
    "switch:command"
  ],
  "files.associations": {
    "*.cjson": "jsonc",
    "*.wxss": "css",
    "*.wxs": "javascript"
  },
  "emmet.includeLanguages": {
    "wxml": "html"
  },
  // 指定工作台中使用的文件图标主题;若指定为 "null",则不显示任何文件图标。
  "workbench.iconTheme": "vscode-icons",
  // 控制具有未保存更改的编辑器的 自动保存。
  "files.autoSave": "afterDelay",
  "breadcrumbs.enabled": false,
  "minapp-vscode.disableAutoConfig": true,
  // 控制终端的字号(以像素为单位)。
  "terminal.integrated.fontSize": 15,
  // 控制输入消息的字号(以像素为单位)。
  "scm.inputFontSize": 15,



}

方案2:

{
  "workbench.startupEditor": "newUntitledFile",
  "workbench.iconTheme": "vscode-icons",
  "workbench.activityBar.visible": true,
  "workbench.editor.showTabs": true,
  "workbench.editor.enablePreview": false,
  "workbench.editor.untitled.hint": "hidden",
  "workbench.settings.useSplitJSON": true,
  "workbench.colorTheme": "Default Dark+",
  "emmet.triggerExpansionOnTab": true,
  "emmet.showAbbreviationSuggestions": true,
  "emmet.showExpandedAbbreviation": "always",
  "emmet.includeLanguages": {
    "javascript": "html"
  },
  "editor.wordWrap": "on",
  "editor.formatOnSave": true,
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
  },
  "editor.tabSize": 2,
  "editor.mouseWheelZoom": true,
  "liveServer.settings.port": 5500,
  "open-in-browser.default": "Chrome",
  "git.enabled": false,
  "git.ignoreWindowsGit27Warning": true,
  "vsicons.dontShowNewVersionMessage": true,
  "files.associations": {
    "*.vue": "vue",
    "*.js": "javascriptreact"
  },
  "search.exclude": {
    "**/node_modules": true,
    "**/bower_components": true,
    "**/dist": true
  },
  // "emmet.syntaxProfiles": {
  //   "javascript": "jsx",
  //   "vue": "html",
  //   "vue-html": "html"
  // },
  // "files.insertFinalNewline": true,
  // "files.trimFinalNewlines": true,
  "terminal.integrated.defaultProfile.windows": "Command Prompt",
  "terminal.integrated.profiles.windows": {
    "PowerShell": {
      "source": "PowerShell",
      "icon": "terminal-powershell"
    },
    "Command Prompt": {
      "path": [
        "${env:windir}\\Sysnative\\cmd.exe",
        "${env:windir}\\System32\\cmd.exe"
      ],
      "args": [],
      "icon": "terminal-cmd"
    },
    "Git Bash": {
      "source": "Git Bash"
    },
    "Windows PowerShell": {
      "path": "C:\\WINDOWS\\System32\\WindowsPowerShell\\v1.0\\powershell.exe"
    }
  },
  // ======================ESLint开始======================
  // "eslint.format.enable": true,
  // "eslint.options": {
  //   "extensions": [
  //     ".js",
  //     ".vue"
  //   ]
  // },
  // "eslint.validate": [
  //   "javascript",
  //   "javascriptreact",
  //   "vue"
  // ],
  // "eslint.workingDirectories": [
  //   ".eslintrc.js",
  //   {
  //     "mode": "auto"
  //   }
  // ],
  // "eslint.enable": true,
  // "eslint.codeAction.showDocumentation": {
  //   "enable": false
  // },
  // "eslint.run": "onType",
  // "eslint.alwaysShowStatus": true,
  // =====================ESLint结束======================
  // =====================Vetur配置开始========================
  // vue保存文件时默认格式化插件
  "[vue]": {
    "editor.defaultFormatter": "octref.vetur",
    "editor.formatOnSave": true
  },
  // 是否验证组件的属性类型
  // "vetur.validation.templateProps": true,
  "vetur.format.defaultFormatter.js": "vscode-typescript",
  // 配置函数名称和小括号之间是否有空格
  "javascript.format.insertSpaceBeforeFunctionParenthesis": true,
  "vetur.format.defaultFormatter.html": "js-beautify-html",
  "vetur.format.defaultFormatterOptions": {
    "prettier": {
      // 不加分号
      "semi": false,
      //用单引号
      "singleQuote": true,
      "trailingComma": "none",
      "bracketSpacing": true,
      "tabWidth": 2,
      "arrowParens": "avoid"
    },
    "js-beautify-html": {
      // 换行长度
      "wrap_line_length": 250,
      //属性换行 force-aligned
      "wrap_attributes": "auto"
    }
  },
  // =====================Vetur配置结束========================
  // "[javascript]": {
  //   // "editor.defaultFormatter": "dbaeumer.vscode-eslint",
  //   "editor.defaultFormatter": "vscode.typescript-language-features"
  // },
  // "[javascriptreact]": {
  //   "editor.defaultFormatter": "esbenp.prettier-vscode"
  // },

  // 不要有分号
  // "prettier.semi": true,
  // 使用单引号
  // "prettier.singleQuote": true,
  // 默认使用prittier作为格式化工具
  // "editor.defaultFormatter": "esbenp.prettier-vscode"
  // 不要有分号
  "prettier.semi": false,
  // 使用单引号
  "prettier.singleQuote": true,
  // 去掉结尾逗号
  "prettier.trailingComma": "none",
  // 默认使用prittier作为格式化工具
  // "editor.defaultFormatter": "esbenp.prettier-vscode"
  // "[javascript]": {
  //   "editor.defaultFormatter": "esbenp.prettier-vscode"
  // }
}