vsCode 格式化配置

学习目标: 基于 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.mzph.cn/news/116445.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

智加科技与东风柳汽达成深度合作 自动驾驶重卡计划2024年初量产交付

(2023年10月19日,苏州)全球领先的重卡自动驾驶技术公司智加科技与东风柳汽宣布,双方共同开发的自动驾驶重卡H7计划2024年初实现量产交付。未来,双方将携手推出安全可靠、高性价比、性能卓越的自动驾驶重卡产品&#xf…

STM32 HAL高级定时器正交编码模式案例

STM32 HAL高级定时器正交编码模式案例 🔖基于stm32F030RBT6单片机采用高级定时器1,编码器模式,测试EC11编码器。 🎬EC11测试效果: 🌿STM32定时器编码器有3种映射模式: ✨本次采用的是上面的模式3&#x…

postgresql14-模式的管理(三)

基本概念 postgresql成为数据库管理系统DBMS,在内存中以进程的形态运行起来成为一个实例,可管理多个database。 数据库databases:包含表、索引、视图、存储过程; 模式schema:多个对象组成一个模式,多个模…

分享一下微信小程序的文章中怎么添加营销活动

在数字化时代,小程序已经成为企业营销的重要工具。通过小程序,企业可以提供更加便捷、高效的服务,吸引更多的用户和客户。本文将以小程序营销活动为主题,介绍如何在小程序文章中加入营销活动,提高品牌知名度和销售额。…

告别SQL优化和数据迁移备份烦恼,NineData--小白也能成为DBA的秘密武器!

1、概述 说起sql优化,大家可能首先想到的是创建索引、避免全表扫描、减少子查询及优化查询语句、避免隐式类型转换、慢查询日志记录慢SQL、explain分析SQL的执行计划及调优等等。当然,这也是我们常使用的一些调优手段,而且对开发人员也有一定…

【C语言】用函数实现模块化程序设计

前言:如果把所有的程序代码都写在一个主函数(main函数)中,就会使主函数变得庞杂、头绪不清,使阅读和维护程序变得困难。此外,有时程序中要多次实现某一功能,如果重新编写实现此功能就会使得程序冗长、不精炼。 &#x…

【数字IC设计/FPGA】FIFO与流控机制

流控,简单来说就是控制数据流停止发送。常见的流控机制分为带内流控和带外流控。 FIFO的流水反压机制 一般来说,每一个fifo都有一个将满阈值afull_value(almost full)。当fifo内的数据量达到或超过afull_value时,将满…

KNN 和 SVM 图片分类 任务 代码及细节分享

使用KNN (K-最近邻) 方法进行图像分类也是一个常见的选择。以下是 使用sklearn的KNeighborsClassifier进行图像分类的Python脚本: import os import cv2 import numpy as np import logging from sklearn.neighbors import KNeighborsClassifier from sklearn.met…

强化学习代码实战(2) --- 多臂赌博机

目录 前言 1.Python基础 2.Numpy基础 3.多臂赌博机 参考文献 前言 本文内容来自于南京大学郭宪老师在博文视点学院录制的视频,课程仅9元地址,配套书籍为深入浅出强化学习 编程实战 郭宪地址。 1.Python基础 1. print() 可以用该语句查看当前数据的情…

2023版 STM32实战11 SPI总线读写W25Q

SPI全称 英文全称:Serial peripheral Interface 串行外设接口 SPI特点 -1- 串行(逐bit传输) -2- 同步(共用时钟线) -3- 全双工(收发可同时进行) -4- 通信只能由主机发起(一主,多从机) 开发使用习惯和理解 -1- CS片选一般配置为软件控制 -2- 片选低电平有效,从…

2023.10.22 关于 定时器(Timer) 详解

目录 引言 标准库定时器使用 自己实现定时器的代码 模拟实现的两大方面 核心思路 重点理解 自己实现的定时器代码最终代码版本 引言 定时器用于在 预定的时间间隔之后 执行特定的任务或操作 实例理解: 在服务器开发中,客户端向服务器发送请求&#…

Spring Cloud 之 GateWay简介及简单DEMO的搭建

(1)Filter(过滤器): 和Zuul的过滤器在概念上类似,可以使用它拦截和修改请求,并且对上游的响应,进行二次处理。过滤器为org.springframework.cloud.gateway.filter.GatewayFilter类的…

Unity3D 基础——鼠标悬停更改物体颜色,移走恢复

方法介绍 【unity学习笔记】OnMouseEnter、OnMouseOver、OnMouseExit_unity onmouseover_一白梦人的博客-CSDN博客https://blog.csdn.net/a1208498468/article/details/117856445 GetComponent()详解_getcomponet<> 动态名称-CSDN博客https://blog.csdn.net/kaixindrag…

牛客网刷题-(2)

&#x1f308;write in front&#x1f308; &#x1f9f8;大家好&#xff0c;我是Aileen&#x1f9f8;.希望你看完之后&#xff0c;能对你有所帮助&#xff0c;不足请指正&#xff01;共同学习交流. &#x1f194;本文由Aileen_0v0&#x1f9f8; 原创 CSDN首发&#x1f412; 如…

jvm垃圾回收算法有哪些及原理

目录 垃圾回收器1 Serial收集器2 Parallel收集器3 ParNew收集器4 CMS收集器5 G1回收器三色标记算法标记算法的过程三色标记算法缺陷多标漏标 垃圾回收器 垃圾回收机制&#xff0c;我们已经知道什么样的对象会成为垃圾。对象回收经历了什么——垃圾回收算法。那么谁来负责回收垃…

华为云 CodeArts Snap 智能编程助手 PyCharm 插件安装与使用指南

1 插件安装下载 1.1 搜索插件 打开 PyCharm&#xff0c;选择 File&#xff0c;点击 Settings。 选择 Plugins&#xff0c;点击 Marketplace&#xff0c;并在搜索框中输入 Huawei Cloud CodeArts Snap。 1.2 安装插件 如上图所示&#xff0c;点击 Install 按钮安装 Huawei Cl…

Socket 是什么? 总结+详解

文章摘要&#xff1a;Socket 套接字 编程接口 netstat-ano 创建 建立连接 断开 删除 1.Socket 是什么 Socket &#xff1a;套接字&#xff08;socket&#xff09;是一个抽象层&#xff0c;应用程序可以通过它发送或接收数据&#xff0c;可对其进行像对文件一样的打开、读写和…

如何把Elasticsearch中的数据导出为CSV格式的文件

前言| 本文结合用户实际需求用按照数据量从小到大的提供三种方式从ES中将数据导出成CSV形式。本文将重点介Kibana/Elasticsearch高效导出的插件、工具集&#xff0c;通过本文你可以了解如下信息&#xff1a; 1&#xff0c;从kibana导出数据到csv文件 2&#xff0c;logstash导…

VMware vCenter Server 6.7安装过程记录

0、前言 最近由于一些原因需要安装测试VMware ESXi&#xff0c;无奈所有服务器都是十几年前的&#xff0c;配置低也不支持。后来通过VMware兼容性列表查询&#xff0c;快要放弃的时候发现唯一一台Dell R420&#xff0c;如获至宝。通过查询得知最高支持到6.5 U3&#xff0c;好在…

十三水中各种牌型判断LUA版

近期回归程序行业&#xff0c;由于业务需求需要做十三水游戏&#xff0c;什么是十三水就不在多讲&#xff0c;下面是判断十三水牌型的方法&#xff08;带大小王&#xff09; GetSSSPaiType {}; local this GetSSSPaiType; local huaseTable {}; local numTable {}; functi…