VScode 在格式化React代码后，将标签换行导致编译出错

最新推荐文章于 2023-11-01 10:36:51 发布
最新推荐文章于 2023-11-01 10:36:51 发布
阅读量1.4k 收藏 1
点赞数 1
分类专栏： 问题 文章标签： vscode
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_37702839/article/details/113363642
版权
博客作者遇到了使用Prettier格式化JSX代码时，标签意外换行的问题。错误提示为'Expected indentation of 18 space characters but found 16'。经过一番查找和尝试，问题的根源在于Prettier的最大长度限制。通过增大最大长度设置，问题得到了解决。此博客分享了解决此类问题的经验和解决方案。
摘要由CSDN通过智能技术生成

prettier格式化jsx，导致标签换行

Expected indentation of 18 space characters but found 16 react/jsx-indent-props

查了好久，网上各种配置

最后发现是这个问题

在这里插入图片描述

将最大长度 设置大一点就 ok

靓仔12138
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
prettier自动格式化去换行的实现代码
10-14
在本文中，我们将深入探讨如何实现Prettier自动格式化去换行的功能，以及相关的配置设置。 首先，要实现Prettier自动去除换行，我们需要创建一个`.prettierrc`配置文件在项目的根目录下。这个文件用于存储Prettier...
vscode 使用Prettier插件格式化配置使用代码详解
10-14
在VSCode中使用Prettier插件可以实现代码的自动格式化，节省开发者的格式化代码时间，提高工作效率。安装Prettier插件后，开发者可以通过简单的配置来定义自己的代码格式化规则。 首先，要在VSCode中安装Prettier...
vscode保存react代码之后自动换行，导致代码格式混乱报错
weixin_42148607的博客
05-03 1076
1.点击插件按钮 2.搜索插件 JS-CSS-HTML Formatter 3.禁用插件 JS-CSS-HTML Formatter 4.重启vscode即可。
用vscode写React中使用jsx语法写html代码没有语法提示，解决方法
THY0827的博客
07-08 722
打开设置找到json文件添加配置。
vue学习遇到的问题
czqbaifnxkj的博客
04-12 348
1.* !!vue-style-loader!css-loader?{"sourceMap":true}!问题 说明是css解析的时候出了问题 所以，解决方案就要根据情况而定，看你使用的CSS语言是什么,是 常规的 或者 less 或者 sass。 如果是 常规 的，执行 npm install stylus-loader css-loader style-loader --save-dev 安装依赖就行。 如果是 less 的，执行 npm install less less-loader --sa
Expected indentation of 16 spaces but found 8 spaces.eslintvue/script-indent
最新发布
qq_44792224的博客
11-01 684
问题：Expected indentation of 16 spaces but found 8 spaces.eslintvue/script-indent原因： 严格地检查缩进问题，并不是报错。
解决Expected indentation of 12 spaces but found 14（已试过有效）
m0_66672422的博客
12-09 2031
解决Expected indentation of 12 spaces but found 14（已试过有效）
Vue-cli Eslint在vscode里代码自动格式化的方法
08-27
在 Visual Studio Code (VS Code) 中，我们可以集成 Eslint 来实现代码自动格式化，这样在保存文件时，代码会自动按照预设的规范调整格式。 1. **Vue CLI 中的 Eslint 集成** Vue CLI 默认已经包含了 Eslint 配置...
vscode-webview-react:在VSCode Webview中创建React App入门
05-02
VSCode Webview React 该项目是通过以下方式引导的 允许扩展在VSCode中创建可自定义的视图。 单页应用程序框架非常适合此用例。 但是，要使现代JavaScript框架/工具链吸引VSCode Webview API的需要对您正在使用的...
VSCode 配置React Native开发环境的方法
11-29
本文介绍了VSCode 配置React Native开发环境的方法，分享给大家，具体如下： 1.安装VSCode 2.安装插件 按F1 并输入 ext install 并回车, 或者使用 输入react-native安装React Native Tools 假定你已经在设备上...
解决 VSCode 编辑 vue 项目报错 Expected indentation of 2 spaces but found 4
01-03
解决 VSCode 编辑 vue 项目报错 Expected indentation of 2 spaces but found 4解决 VSCode 编辑 vue 项目报错 Expected indentation of 2 spaces but found 4问题问题分析解决办法一解决办法二 解决 VSCode 编辑 vue 项目报错 Expected indentation of 2 spaces but found 4 系统：Win10 编辑器：VSCode 问题 使用 VSCode 在写 Vue 项目的时候，出现报错 Expected indentation of 2 spaces
vscode配置vue下的es6规范自动格式化详解
10-17
现在，当你在Vue项目中编写或保存ES6代码时，VSCode将自动应用ESLint的规则进行格式化，确保代码符合ES6规范。 需要注意的是，为了使ESLint正确工作，你需要在项目根目录下配置`.eslintrc.js`或`.eslintrc.yaml`...
解决SyntaxHighlighter 代码高亮不换行问题的解决方法
10-25
它能够将普通的文本代码转换为色彩鲜明、格式整齐的代码展示。然而，有些开发者在使用SyntaxHighlighter时可能会遇到一个常见问题：代码无法正确换行，导致代码块看起来杂乱无章，极大地影响了阅读体验。这个问题...
VScode格式化ESlint方法(最全最好用方法)
10-16
例如，需要在设置中添加"editor.formatOnSave": true，这样每次保存文件时，VSCode会自动使用ESlint对代码进行格式化。另一个重要设置是"eslint.autoFixOnSave": true，它允许ESlint在保存时自动修复可修复的问题。 ...
VSCode配置react开发环境的步骤
08-28
在 VSCode 中，需要安装 prettier-eslint 插件，以便按照 ESLint 规则保存文件时自动格式化 JSX 代码。可以通过 npm install prettier-eslint --save-dev 安装 prettier-eslint 插件。 五、配置 VSCode Workspace ...
技术总结-error Expected indentation of 2 spaces but found 3 indent与 Expected space or tab after ‘//
Abigail路小雨的博客
08-06 420
每次我们编译vue文件的时候老是这样密密麻麻的格式错误!!! 每次调整的话很影响写代码的速度, 项目中的.eslintrc.json 的配置文件，再配置文件中，这个文件中有诸多规定，今后的开发中需要注意这些使用规范， 按照eslint 代码规则器2来开发，遵循eslint的代码规则，否则会报错。 所以我们要 1.打开.eslintrc.js文件 在根目录下面寻找 注释掉 //'@vue/standard' 之后记得要保存!!!然后重启npm run serve或者yarn serve ...
eslint报错 Expected indentation of x spaces but found x tabs
qq_40597889的博客
01-02 1104
Expected indentation of x spaces but found x tabs 编译器：vscode 解决方案： 打开command+shift+p控制面板 输入fix all auto-fixable problem回车。
ESLint Expected indentation of O spaces but found 2. (indent)
weixin_41992772的博客
05-08 978
修改 .eslintignore 新增一个*.vue就回取消检查dve模式可以忽略 如果要发版建议去掉,在统一修改 欢迎一起讨论学习 qq群:761860176
vscode react代码格式化插件
09-06
安装Prettier插件后，可以在VSCode的设置中配置Prettier的格式化规则，并且在保存文件时自动格式化代码。 2. ESLint：ESLint是一个JavaScript代码检查工具，可以帮助你遵循一致的代码风格和最佳实践。通过安装...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值