biomejs / biome

A toolchain for web projects, aimed to provide functionalities to maintain them. Biome offers formatter and linter, usable via CLI and LSP.
https://biomejs.dev
Apache License 2.0
15.28k stars 475 forks source link

📝 Biome breaks template strings where prettier doesn't #2470

Closed itsMapleLeaf closed 6 months ago

itsMapleLeaf commented 6 months ago

Environment information

CLI:
  Version:                      1.7.0
  Color support:                true

Platform:
  CPU Architecture:             x86_64
  OS:                           windows

Environment:
  BIOME_LOG_DIR:                unset
  NO_COLOR:                     unset
  TERM:                         unset
  JS_RUNTIME_VERSION:           "v20.11.1"
  JS_RUNTIME_NAME:              "node"
  NODE_PACKAGE_MANAGER:         unset

Biome Configuration:
  Status:                       Loaded successfully
  Formatter disabled:           false
  Linter disabled:              false
  Organize imports disabled:    false
  VCS disabled:                 false

Formatter:
  Format with errors:           false
  Indent style:                 Tab
  Indent size:                  0
  Indent width:                 0
  Line ending:                  Lf
  Line width:                   100
  Attribute position:           Auto
  Ignore:                       []
  Include:                      []

JavaScript Formatter:
  Enabled:                      false
  JSX quote style:              Double
  Quote properties:             AsNeeded
  Trailing comma:               All
  Semicolons:                   AsNeeded
  Arrow parentheses:            Always
  Bracket spacing:              false
  Bracket same line:            false
  Quote style:                  Double
  Indent style:                 unset
  Indent size:                  unset
  Indent width:                 unset
  Line ending:                  unset
  Line width:                   unset
  Attribute position:           Auto

JSON Formatter:
  Enabled:                      true
  Indent style:                 unset
  Indent width:                 unset
  Indent size:                  unset
  Line ending:                  unset
  Line width:                   unset
  Trailing Commas:              unset

Workspace:
  Open Documents:               0

Configuration

{
    "$schema": "./node_modules/@biomejs/biome/configuration_schema.json",
    "linter": {
        "enabled": true,
        "rules": {
            "recommended": true,
            "a11y": {
                "noAutofocus": "off",
                "useKeyWithClickEvents": "off"
            },
            "correctness": {
                "noUnusedImports": "warn"
            },
            "performance": {
                "noDelete": "off"
            },
            "suspicious": {
                "noArrayIndexKey": "off",
                "noAssignInExpressions": "off",
                "noImplicitAnyLet": "off"
            },
            "style": {
                "useImportType": "warn",
                "noUnusedTemplateLiteral": "off",
                "noParameterAssign": "off",
                "useConsistentArrayType": "warn",
                "useNodejsImportProtocol": "warn"
            }
        }
    },
    "organizeImports": {
        "enabled": true
    },
    "formatter": {
        "enabled": true,
        "lineWidth": 100
    },
    "vcs": {
        "enabled": true,
        "clientKind": "git",
        "useIgnoreFile": true
    },
    "javascript": {
        "formatter": {
            "semicolons": "asNeeded"
        }
    },
    "overrides": [
        {
            "include": ["package.json"],
            "formatter": {
                // match bun
                "indentStyle": "space"
            }
        }
    ]
}

Playground link

https://biomejs.dev/playground/?trailingComma=es5&arrowParentheses=as-needed&code=YwByAGUAYQB0AGUAQQB0AHQAcgBpAGIAdQB0AGUAUgBvAGwAbABNAGUAcwBzAGEAZwBlACgAewAKAAkACQBjAG8AbgB0AGUAbgB0ADoAIABgACQAewBzAGUAbABmAEMAaABhAHIAYQBjAHQAZQByAC4AbgBhAG0AZQBWAGkAcwBpAGIAbABlACAAPwAgAHMAZQBsAGYAQwBoAGEAcgBhAGMAdABlAHIALgBkAGkAcwBwAGwAYQB5AE4AYQBtAGUAIAA6ACAAIgA%2FAD8APwAiAH0AOgAgACQAewB2AGEAbAB1AGUAcwAuAHMAZQBsAGYAQQB0AHQAcgBpAGIAdQB0AGUAPwAuAG4AYQBtAGUAIAA%2FAD8AIAAiAFMAdAByAGUAbgBnAHQAaAAiAH0AYAAsAAoACQAJAGEAdAB0AHIAaQBiAHUAdABlAFYAYQBsAHUAZQA6ACAAcwBlAGwAZgBDAGgAYQByAGEAYwB0AGUAcgBbAHYAYQBsAHUAZQBzAC4AcwBlAGwAZgBBAHQAdAByAGkAYgB1AHQAZQA%2FAC4AawBlAHkAIAA%2FAD8AIAAiAHMAdAByAGUAbgBnAHQAaAAiAF0ALAAKAAkACQBiAG8AbwBzAHQAQwBvAHUAbgB0ADoAIAB2AGEAbAB1AGUAcwAuAHMAZQBsAGYAQgBvAG8AcwB0AEMAbwB1AG4AdAAsAAoACQAJAHMAbgBhAGcAQwBvAHUAbgB0ADoAIAB2AGEAbAB1AGUAcwAuAHMAZQBsAGYAUwBuAGEAZwBDAG8AdQBuAHQALAAKAAkAfQApAA%3D%3D

Code of Conduct


Side note: the actual line in my project is longer and goes past 100 characters, but I had to set 80 characters in the playground to illustrate the issue

Elvis116 commented 6 months ago

I need this for @emotion/styled format as well.