vscode-settings.json配置(prettier + eslint)

1、设置全局settings.json文件

command + p 搜索到settings.json文件,文件配置及注释如下

  "workbench.iconTheme": "vscode-icons-mac",
  "editor.renderIndentGuides": false,
  "cSpell.ignoreWords": ["antd"],
  //编辑器失去焦点时自动保存更新后的文件
  "files.autoSave": "onFocusChange",
  "workbench.colorTheme": "Monokai",
  "git.confirmSync": false,
  "window.title": "${activeEditorLong}${separator}${rootName}",
  "window.zoomLevel": 0,
  "editor.fontSize": 14,
  //为了符合eslint的两个空格间隔原则
  "editor.tabSize": 2,
  // 文件头部注释
  "fileheader.Author": "niuchunling",
  "fileheader.LastModifiedBy": "niuchunling",
  //关闭编辑器默认代码检查,为了不跟eslint配置冲突
  "editor.formatOnSave": false,
  "javascript.format.enable": false,
  //eslint 格式化插件,保存时应用eslint规则自动格式化后保存
  "eslint.autoFixOnSave": true,
  "prettier.eslintIntegration": true,
  // 去掉代码结尾分号
  "prettier.semi": false,
  "git.path": "/usr/bin/git",
  "editor.fontFamily": "Microsoft YaHei,Menlo, Monaco, 'Courier New', monospace",
  "editor.fontWeight": "bold",
  "javascript.updateImportsOnFileMove.enabled": "never",
  "explorer.confirmDragAndDrop": false
}
复制代码

2、 设置项目自己的规则

在项目根目录新建.vscode文件夹,文件夹中新建settings.json覆盖全局的setings.json文件,配置同上

tips: 以上都是基于几个前提

  • 编辑器安装了Prettier - Code formatter 插件并启用
  • 项目配置了使用eslint
  • fileheader相关配置是安装了Document This插件
  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
### 回答1: 在VSCode中,Prettier是一款非常有用的代码格式化工具,可帮助我们保持一致的代码风格。要在VSCode配置Prettier的设置,我们需要打开VSCode的设置面板,并找到settings.json文件。 为了打开settings.json文件,可以按下快捷键Ctrl +,然后在搜索栏中键入“settings.json”。点击打开settings.json文件,即可进行编辑。 在settings.json文件中,我们可以配置各种Prettier的设置选项。下面是一些常见的配置选项: 1. "prettier.printWidth": 80 这个选项用于设置一行的最大字符数。当一行超过设定的限制时,Prettier会自动将代码换行。 2. "prettier.tabWidth": 4 这个选项用于设置一个制表符的宽度。默认情况下,Prettier使用2个空格来缩进代码。通过设置tabWidth为4,我们可以指定缩进为4个空格。 3. "prettier.singleQuote": true 这个选项用于设置是否使用单引号来包裹字符串。如果将其设置为true,Prettier会将双引号转换为单引号。 4. "prettier.trailingComma": "es5" 这个选项用于设置是否在对象和数组字面量的末尾加上逗号。在es5模式下,Prettier会添加末尾的逗号。 5. "prettier.bracketSpacing": true 这个选项用于设置是否在对象字面量的属性和值之间添加空格。 以上只是一些常见的配置选项,Prettier还有很多其他的配置选项可以根据个人需求进行设置。配置完成后,保存settings.json文件即可生效。 总之,通过在settings.json文件中配置Prettier的选项,我们可以定制化PrettierVSCode中的行为,以满足我们对代码格式的需求。 ### 回答2: VSCode中的Settings.json文件用于配置编辑器的各种设置,包括Prettier插件的设置。 Prettier是一款代码格式化工具,可以帮助开发人员维持代码的一致性和可读性。通过在Settings.json配置Prettier的相关设置,我们可以自定义Prettier的行为和样式。 要配置PrettierSettings.json,首先需要打开VSCode的设置。可以通过点击左侧的文件夹图标,然后点击齿轮图标,选择“Settings”打开设置。 在设置中搜索“Prettier”,可以看到Prettier的相关设置选项。下面是一些常用的设置示例: 1. "prettier.singleQuote": true - 自动将双引号转换为单引号。 2. "prettier.tabWidth": 4 - 设置缩进长度为4个空格。 3. "prettier.trailingComma": "es5" - 设置尾逗号的使用风格为ES5规则。 4. "prettier.printWidth": 80 - 设置每行代码的最大宽度为80个字符。 可以根据个人喜好和团队规范来设置Prettier的行为和样式,然后保存设置即可生效。 需要注意的是,为了使设置生效,需要确保已经安装了Prettier插件,并且正确配置了工作区或全局的Settings.json文件。 通过在Settings.json配置Prettier的相关设置,可以更好地使用Prettier工具来自动格式化代码,提高代码质量和可读性。希望以上回答对您有帮助! ### 回答3: VSCodePrettier是一款非常受欢迎的代码格式化工具,能够帮助开发者自动格式化代码,使其具有一致的风格。而"settings.json"是VSCode配置文件之一,可以用来定制编辑器的行为。下面是关于"settings.json"中VSCode Prettier配置的详细说明。 首先,要在VSCode配置Prettier,需要在"settings.json"中增加一些相关配置。打开VSCode并进入"Preferences"(偏好设置)页面,选择"Settings"(设置)。在搜索框中输入"Prettier Configuration Path",可以找到"Prettier: Configuration Path"这个项。在其右侧的输入框中,输入Prettier配置文件路径,可以是一个具体文件的路径或者是一个包含配置的目录的路径。 接下来,还可以在"settings.json"中针对Prettier进行更详细的配置。例如,可以设置"Prettier: Tslint Integration",决定是否集成TSLint的格式化规则;"Prettier: Eslint Integration",决定是否集成ESLint的格式化规则;"Prettier: Stylelint Integration",决定是否集成Stylelint的格式化规则。这些配置可以根据项目的具体需求进行调整。 此外,还可以设置一些Prettier的格式化规则。例如,可以通过"Prettier: Print Width"来设置一行的最大字符数;通过"Prettier: Tab Width"来设置制表符的宽度;通过"Prettier: Single Quote"来设置字符串使用单引号还是双引号等。具体的格式化规则可根据个人需求进行调整。 总之,在"settings.json"中配置VSCodePrettier相关项,能够让我们更方便地使用和定制Prettier的格式化功能,从而提高代码的可读性和一致性。

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值