vsCode 格式化配置

news/2024/11/17 4:42:37/

学习目标: 基于 vsCode 配置格式化工具,提高(React、Vue )开发效率
 1. vsCode 安装 prettier 插件并启用
 2. 修改配置文件 setting.json
setting.json 位置:
依次点击
在这里插入图片描述
在这里插入图片描述

替换内容:↓

{"git.enableSmartCommit": true,// 修改注释颜色"editor.tokenColorCustomizations": {"comments": {"fontStyle": "bold","foreground": "#82e0aa"}},// 配置文件类型识别"files.associations": {"*.js": "javascript","*.json": "jsonc","*.cjson": "jsonc","*.wxss": "css","*.wxs": "javascript"},"extensions.ignoreRecommendations": false,"files.exclude": {"**/.DS_Store": true,"**/.git": true,"**/.hg": true,"**/.svn": true,"**/CVS": true,"**/node_modules": false,"**/tmp": true},// "javascript.implicitProjectConfig.experimentalDecorators": true,"explorer.confirmDragAndDrop": false,"typescript.updateImportsOnFileMove.enabled": "prompt","git.confirmSync": false,"editor.tabSize": 2,"editor.fontWeight": "500","[json]": {},"editor.tabCompletion": "on","vsicons.projectDetection.autoReload": true,"editor.fontFamily": "Monaco, 'Courier New', monospace, Meslo LG M for Powerline","[html]": {"editor.defaultFormatter": "vscode.html-language-features"},"editor.fontSize": 16,"debug.console.fontSize": 14,"vsicons.dontShowNewVersionMessage": true,"editor.minimap.enabled": true,"emmet.extensionsPath": [""],// vue eslint start 保存时自动格式化代码"editor.formatOnSave": true,// eslint配置项,保存时自动修复错误"editor.codeActionsOnSave": {"source.fixAll": true},"vetur.ignoreProjectWarning": true,// 让vetur使用vs自带的js格式化工具// uni-app和vue 项目使用"vetur.format.defaultFormatter.js": "vscode-typescript","javascript.format.semicolons": "remove",// // 指定 *.vue 文件的格式化工具为vetur"[vue]": {"editor.defaultFormatter": "octref.vetur"},// // 指定 *.js 文件的格式化工具为vscode自带"[javascript]": {"editor.defaultFormatter": "vscode.typescript-language-features"},// // 默认使用prettier格式化支持的文件"editor.defaultFormatter": "esbenp.prettier-vscode","prettier.jsxBracketSameLine": true,// 函数前面加个空格"javascript.format.insertSpaceBeforeFunctionParenthesis": true,"prettier.singleQuote": true,"prettier.semi": false,// eslint end// react// 当按tab键的时候,会自动提示"emmet.triggerExpansionOnTab": true,"emmet.showAbbreviationSuggestions": true,"emmet.includeLanguages": {// jsx的提示"javascript": "javascriptreact","vue-html": "html","vue": "html","wxml": "html"},// end"[jsonc]": {"editor.defaultFormatter": "vscode.json-language-features"},// @路径提示"path-intellisense.mappings": {"@": "${workspaceRoot}/src"},"security.workspace.trust.untrustedFiles": "open","git.ignoreMissingGitWarning": true,"window.zoomLevel": 1
}

 3. 重启 vsCode
 4. 安装 Error Lens(行内实时错误提示,支持 vue 与 React)


http://www.ppmy.cn/news/1173280.html

相关文章

亚马逊云代码AI助手CodeWhisperer使用教程

一、CodeWhisperer 简介 1、CodeWhisperer是一款基于机器学习的通用代码生成器,由Amazon出品,可以给我们提供代码建议。 2、CodeWhisperer 基于各种上下文线索提供建议,包括光标在源代码中的位置、位于光标前面的代码、注释,以及…

C# 写入文件比较

数据长度:128188个long BinaryWriter每次写一个long 耗时14.7828ms StreamWriter每次写一个long 耗时44.0934 ms FileStream每次写一个long 耗时20.5142 ms FileStream固定chunk写入,循环操作数组,耗时13.4126 ms byte[] chunk new byte[d…

第二证券:指数是什么意思?

跟着经济全球化的加速和商场化进程的深化,指数已成为金融商场重要的风向标和抉择方案参看。指数是依据商场上必定数量的标的股票价格改变而核算的数值,代表了特定股票商场的全体涨跌状况。本文将从多个视点剖析指数的意义和作用。 一、指数的品种和核算…

C++——优先级队列priority

一、介绍 优先级队列默认使用vector作为其底层存储数据的容器,在vector上又使用了堆算法将vector中元素构造成堆的结构,因此priority_queue就是堆,所有需要用到堆的位置,都可以考虑使用priority_queue。(注意&#xf…

如何部署和配置IPv6

环境: IPv6 问题描述: 如何部署和配置IPv6 解决方案: 要了解 IPv6,首先需要了解 IPv4,因为 IPv6 是 IPv4 的升级版本。IPv4 是互联网上最常见的 IP 地址协议,它使用 32 位地址,可以表示大约…

使用VisualSVN在Windows系统上设置SVN服务器,并结合内网穿透实现公网访问

文章目录 前言1. VisualSVN安装与配置2. VisualSVN Server管理界面配置3. 安装cpolar内网穿透3.1 注册账号3.2 下载cpolar客户端3.3 登录cpolar web ui管理界面3.4 创建公网地址 4. 固定公网地址访问 前言 SVN 是 subversion 的缩写,是一个开放源代码的版本控制系统…

1024啊啊啊啊啊啊

1024 程序员节快乐,没什么想发的,只是想要个1024胸章。