WebStrom 与 eslint 格式化代码冲突

最新推荐文章于 2024-03-18 11:30:23 发布
最新推荐文章于 2024-03-18 11:30:23 发布
阅读量4.1k 收藏 2
点赞数
分类专栏： Web 文章标签： WbeStorm Prettier Vue 格式化 警告
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/starhosea/article/details/89709127
版权

问题

当Vue项目采用了 eslint+prettier 控制代码风格时，WebStorm 默认的格式化代码（Reformat Code） 会和这套工具的代码风格冲突。具体表现是：我们是用 Ctrl+Shift+F 格式化代码，格式化后WebStrom 反而出现很多黄色警告。
在这里插入图片描述

解决

采用 prettier 来格式化代码，不使用 WebStrom 自带代码格式化工具。

打开WebStorm ， File->Settings->Keymap，搜索 reformat ，找到 ReformatCode 和 ReformatCode with Prettier， 将常用的格式化快捷键 Ctrl+Shift+F 设置给后者。
在这里插入图片描述

Star丶Xing
关注
  • 0
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
webstrom eslint插件
04-21
主要是websorm的eslint语法的插件，到时候我会写一篇webstorm2018配置eslint的文章，敬请期待
vscode 下使用eslint和prettier行代码格式化
热门推荐
星环
08-21 1万+
vscode 下代码格式化以及检查 eslint prettier 语法检查 代码风格 JavaScript
ESLint自动格式化代码
qq_42931285的博客
03-07 1087
ESLint自动格式化代码
webstorm 中使用 Eslint+Prettier统一代码风格
fwzzzzz的博客
10-28 1841
nestjs
webstorm 使用prettier格式化保存 导致代码缩进与gitlab代码不一致问题
最新发布
HHH917的博客
03-18 223
webstorm显示缩进正常。gitlab显示不正常。
webStrom vue eslint 与 prettier冲突
qq_42339350的博客
05-16 734
1 排除两者冲突 eslint-config-prettier yarn add eslint-config-prettier -D .eslintrc.js 'extends': [ "prettier" ], .eslintrc.json "extends": [ "prettier" ] 2 修改代码风格,
解决vue在webstrom中的代码格式化问题
plan_jok的博客
11-03 5002
vue 项目 webstrom IDE格式化代码规则遵循eslint设置 首先vue-cli生成了一个项目，开启了eslint的检测， 但是根据webstorm的快捷格式化代码 ctrl+alt+L会造成eslint报错。 解决办法一： 编辑器打开文件 首先，在编辑器里面要启用eslint 插件 在 .eslintrc.js 上右键，菜单底部有一个 “Apply ESLint Code Style Rule” 点它，之后自动格式化就会按照 eslint 的规则了 解决办法二： webstorm 设置页面-&
webstorm格式化配置
tianlin0203的博客
05-07 1416
本文采用个人认为比较合理的格式化配置。打开webstorm的 Editor > Code Style。
prettier+lint-staged+husky提交(commit)时格式化代码格式
cc_King的博客
05-11 299
prettier+lint-staged+husky提交(commit)时格式化代码格式
解决webstorm代码格式化与eslint-vue 缩进规则冲突
qq_40593496的博客
04-24 1638
webstorm 设置Vue中 Script 标签首层不缩进解决方法1（放弃缩进）：解决方法2（仍要缩进）： webstorm 的缩进规则与 eslint-vue 冲突， webstorm格式化后如下： <script> exports default { } </script> eslint-vue规则限制如下： <script> exports default { } </script> 解决方法1（放弃缩进）： 修改 Webstorm
如何优雅的让Webstorm按照eslint规则reformat
wjc133的专栏
07-13 2122
前端项目中经常会有不同的规范，比如Airbnb的stardend标准，要求每行结尾不加分号、字符串必须使用单引号等。但Webstorm中有自己的一套代码规范，格式化的时候根本不按照eslint来，怎么才能让Webstorm遵循eslint的规则呢？...
代码格式化文档
02-21
用途：让java代码统一用一个代码规范，具体操作参考: https://mp.csdn.net/postedit/87862958
json的格式化工具
05-22
格式化显示json，一目了然，开发必备，非常不错的工具
webstrom配置git上传下拉代码演示
01-15
webstrom如何配置git上传和下拉代码环境配置，教程详解
webstrom2017最新常用开发配置文件，黑色代码风格
10-22
webstrom 常用web开发配置文件有常用vue es6 react typesecript 代码模版
node-gyp rebuild 报错
Star丶Xing
04-30 1万+
使用管理员打开 Power Shell ，执行 npm install -g windows-build-tools 再次执行 node-gyp rebuild 即可
npm 的 --unsafe-perm 参数
Star丶Xing
12-04 1万+
npm 出于安全考虑不支持以 root 用户运行，即使你用 root 用户身份运行了，npm 会自动转成一个叫 nobody 的用户来运行，而这个用户几乎没有任何权限。这样的话如果你脚本里有一些需要权限的操作，比如写文件（尤其是写 /root/.node-gyp），就会崩掉了。 为了避免这种情况，要么按照 npm 的规矩来，专门建一个用于运行 npm 的高权限用户；要么加 --unsafe-per...
CSS 文字溢出 text-overflow，word-break，word-wrap，white-space
Star丶Xing
05-06 4561
1. 什么是单词（word ） 英文的单词我们都知道，空格分开的都是一个个单词，中文的单词在浏览器中指的一个字。 下面是一个浏览器判定单词的例子： 中文 //2 个单词 Hello world //2 个单词 Helloworld //1 个单词 2. word-wrap 和 word-break word-wrap 值 描述 normal 只在允许的断字点换行（浏览器保持默...
webstrom每次ctrl+s保存都自动格式化代码，怎么取消掉这个功能？
06-09
您可以按照以下步骤取消WebStorm自动格式化代码功能： 1. 打开WebStorm的设置界面，可以通过菜单栏中的“File”->“Settings”打开。 2. 在左侧的导航栏中，选择“Editor”->“Code Style”。 3. 在右侧的界面中，选择您使用的编程语言，比如“JavaScript”。 4. 在“JavaScript”的设置页面中，找到“On save”选项。 5. 将“On save”选项中的“Reformat code”选项取消勾选。 6. 点击“Apply”和“OK”按钮保存更改并退出设置界面。 这样，WebStorm就不会在每次保存代码时自动格式化代码了。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值