标签: prettier

在 VSCode 中使用插件配置 prettier 后，保存函数的格式会value向我的 React+TS 代码中的每个非默认导入添加奇怪的关键字。

像这样：

import { value ApolloProvider } from '@apollo/client';
import { value BrowserRouter as Router, value Switch } from 'react-router-dom';
import Routes from './routes';
import { value client } from './data/apollo-config';

TS抱怨这个Duplicate identifier 'value'.ts(2300)

有人能帮我解决这个问题吗？不知道为什么会发生这种情况以及如何解决。运行npx prettier --write someFile不会添加value关键字。

我的package.json：

    "dependencies": {
        "@apollo/client": "^3.3.6",
        "axios": "^0.21.1",
        "graphql": "^15.4.0",
        "react": "^17.0.1",
        "react-dom": "^17.0.1",
        "react-router-dom": "^5.1.2",
        "react-scripts": "^4.0.0"
    },
    "devDependencies": {
        "prettier": "^2.1.2",
        "eslint-config-prettier": "^8.3.0",
        "eslint-plugin-cypress": "^2.11.2",
        "eslint-plugin-prettier": "^3.1.4",
        "@types/jest": …

我运行此命令后触发了错误：

npx eslint "the code directory"

这是错误的前几行

TypeError: prettier.resolveConfig.sync is not a function
Occurred while linting *the first line of the first code directory*  
Rule: "prettier/prettier"
    at Program (*the main directory*\node_modules\eslint-plugin-prettier\eslint-plugin-prettier.js:138:40)

这些是 eslint、prettier 和来自 package.json 的其他配置

"eslint": "^8.42.0",
"eslint-config-prettier": "^8.8.0",
"eslint-plugin-cypress": "^2.13.3",
"eslint-plugin-prettier": "^4.2.1",
"prettier": "3.0.0",
"prettier-eslint": "^15.0.1"

我尝试从 node_modules 中删除文件并运行“npm i”，然后重新启动 IDE（使用 VS Code），它仍然发生。

假设我们有一行代码：

const a = 'a'; const b = 'b';

我们不希望它被 Prettier 格式化。

到目前为止我尝试过的：

1）

// prettier-ignore
const a = 'a'; const b = 'b';

// prettier-ignore-start
const a = 'a'; const b = 'b';
// prettier-ignore-end

在这两种情况下，它都会转化为：

const a = 'a';
const b = 'b';

那么如何忽略一段代码呢？

我想一起使用Prettier和ESLint,但我只是通过一个接一个地运行它们而遇到了一些冲突.我看到有这三个包似乎允许它们串联使用:

• prettier-eslint
• eslint-plugin-prettier
• eslint-config-prettier

但是,我不确定使用哪个,因为这些包名都包含eslint和prettier.

我应该使用哪个？

我正在尝试使用 eslint 格式化我的代码，但是当我运行时，npm run lint -f我得到了这个输出：

Oops! Something went wrong! :(
ESLint: 6.8.0.
ESLint couldn't find the config "prettier" to extend from. Please check that the name of the config is correct.   
The config "prettier" was referenced from the config file in "/project/node_modules/eslint-plugin-prettier/eslint-plugin-prettier.js".

这是我的依赖 package.json

{
  "scripts": {
    "lint": "eslint \"**/*.{js,ts}\" --quiet --fix",
  },
  "private": true,
  "dependencies": {
    "tslib": "^1.11.1",
    "zone.js": "^0.10.3"
  },
  "devDependencies": {
    "@typescript-eslint/eslint-plugin": "^2.30.0",
    "@typescript-eslint/parser": "^2.30.0",
    "codelyzer": "^5.2.2",
    "eslint": "^6.8.0",
    "eslint-config-google": "^0.14.0",
    "eslint-plugin-import": "^2.20.2",
    "eslint-plugin-prettier": …

我只是使用webpack模板设置一个vue项目,如下所示:http://vuejs-templates.github.io/webpack/

但是在运行npm run dev之后只是为了测试模板是否正常工作,我得到了这个错误:

Failed to compile with 2 errors                                                                                                                                                                                                                                                           21:49:02
 error  in ./src/App.vue

Module build failed: Error: No parser and no file path given, couldn't infer a parser.
    at normalize (path\node_modules\prettier\index.js:7051:13)
    at formatWithCursor (path\node_modules\prettier\index.js:10370:12)
    at path\node_modules\prettier\index.js:31115:15
    at Object.format (path\node_modules\prettier\index.js:31134:12)
    at Object.module.exports (path\node_modules\vue-loader\lib\template-compiler\index.js:80:23)

 @ ./src/App.vue 11:0-354
 @ ./src/main.js
 @ multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./src/main.js

 error  in ./src/components/HelloWorld.vue

Module build failed: Error: No parser and no file path given, couldn't infer a parser.
    at normalize (path\node_modules\prettier\index.js:7051:13)
    at formatWithCursor (path\node_modules\prettier\index.js:10370:12)
    at …

当我尝试使用 prettier --check 检查样式时遇到这个问题

Code style issues found in the above file(s). Forgot to run Prettier?

我正在尝试设置一些工具来帮助维护多个开发人员使用的代码库的一致性.是否有必要一起使用EditorConfig,ESlint和Prettier？据我所知,EditorConfig用于设置编码样式/规则,ESlint用于确保代码的格式一致,如果代码不遵循规则则抛出警告,并且更漂亮用于根据规则自动格式化代码.但是,我相信你可以更漂亮地自定义规则,这反过来又完成了EditorConfig的工作.这是真的？用于维护一致代码的最佳工具组合是什么？

我在 VS Code 中使用 Prettier。我注意到在保存时使用格式时，Prettier 每次都会在对象的最后一行添加尾随逗号。

例如，假设我有一个这样的 JS 对象：

obj = {
 hello: 'hello',
 world: 'world'
}

Prettier 把它变成了这样：

obj = {
 hello: 'hello',
 world: 'world',
}

注意后面的额外逗号 'world'

在设置中没有找到解决此问题的选项。

我在 VS Code 中使用 prettier 来格式化我的代码，但我真的不喜欢它的方式。

我的主要问题是它将属性拆分为多行。

<input
    type="checkbox"
    name="asiaNews"
    id="asiaNews"
    value="asiaNews"
/>

我更喜欢它看起来像这样

<input type="checkbox" name="asiaNews" id="asiaNews" value="asiaNews" />

我在文档或 SO 上找不到任何内容

如何防止 VS Code 将长 HTML 行分成多行？

有没有办法做到这一点或我可以使用不同的工具，以便我可以拥有适合我的感受的自定义格式规则？