script-indent.md

Pattern: Inconsistent indentation in <script>

Issue: -

Description

This rule is similar to core indent rule, but it has an option for inside of <script> tag.

<script>
let a = {
  foo: 1,
  bar: 2
}
let b = {
      foo: 1,
      bar: 2
    },
    c = {
      foo: 1,
      bar: 2
    }
const d = {
        foo: 1,
        bar: 2
      },
      e = {
        foo: 1,
        bar: 2
      }
</script>

Options

{
  "vue/script-indent": ["error", TYPE, {
    "baseIndent": 0,
    "switchCase": 0,
    "ignores": []
  }]
}

• TYPE (number | "tab") ... The type of indentation. Default is 2. If this is a number, it's the number of spaces for one indent. If this is "tab", it uses one tab for one indent.
• baseIndent (integer) ... The multiplier of indentation for top-level statements. Default is 0.
• switchCase (integer) ... The multiplier of indentation for case/default clauses. Default is 0.
• ignores (string[]) ... The selector to ignore nodes. The AST spec is here. You can use esquery to select nodes. Default is an empty array.

{
  "rules": {
    "vue/script-indent": ["error", 4, { "baseIndent": 1 }]
  },
  "overrides": [
    {
      "files": ["*.vue"],
      "rules": {
        "indent": "off"
      }
    }
  ]
}

2, "baseIndent": 1

<script>
  let a = {
    foo: 1,
    bar: 2
  }
  let b = {
        foo: 1,
        bar: 2
      },
      c = {
        foo: 1,
        bar: 2
      }
  const d = {
          foo: 1,
          bar: 2
        },
        e = {
          foo: 1,
          bar: 2
        }
</script>

Further Reading

• eslint-plugin-vue - script-indent