0

我正在使用eslint-config-prettierandeslint-plugin-prettier包通过 ESLint 运行 Prettier。我也将 Prettier 作为开发依赖项用于非 JS 文件。我将这两个扩展与 VS Code 一起使用，在保存时自动验证和格式化我的代码： Prettier - Code formatter和ESLint。

我在 HTML 文件中遇到内联 JS 的问题。似乎通过 ESLint 运行的 Prettier 要么没有运行，要么被常规的 Prettier 扩展所否决，即使在我的配置文件中我已经明确设置了选项html.format.contentUnformatted以"pre,code,textarea,script"防止使用默认格式化程序格式化该内容。我希望它忽略script标签中的内容，因为 ESLint 应该在那里处理格式。

我的相关设置settings.json：

{
  "javascript.validate.enable": false,  // turns off default VS Code validation, I'm using ESLint's
  "javascript.format.enable": false,    // ^ see above
  "editor.formatOnSave": true,          // Turn on formatting for all files except JS/JSX
  "[javascript]": {
    "editor.formatOnSave": false
  },
  "[javascriptreact]": {
    "editor.formatOnSave": false
  },
  "eslint.alwaysShowStatus": true,
  "editor.codeActionsOnSave": {
    "source.fixAll": true // Let ESLint fix all fixable errors on save
  },
  "eslint.run": "onSave", // Run ESLint on save
  // Turn off Prettier for JS since we are doing it through Eslint already
  "prettier.disableLanguages": ["javascript", "javascriptreact"],
  "html.validate.scripts": false, // turn off default VSCode JS validation in HTML files
  "editor.defaultFormatter": "esbenp.prettier-vscode", // Use Prettier formatter
  "html.format.contentUnformatted": "pre,code,textarea,script" // Don't format content within these tags
}

知道有什么问题吗？我也愿意接受其他方式来构建事物的建议。谢谢你的帮助！

4

1 回答 1

1

您可以使用 Prettier 的embeddedLanguageFormatting选项来实现您想要的。请参阅https://prettier.io/docs/en/options.html#embedded-language-formatting

至于html.format.*VS Code 设置，是 VS Code 内置格式化程序的设置，与 Prettier 无关。

于 2021-01-26T13:23:24.513 回答