# vue/script-indent
enforce consistent indentation in
<script>
- 🔧 The
--fixoption on the command line (opens new window) can automatically fix some of the problems reported by this rule.
# 📖 Rule Details
This rule is similar to core indent (opens new window) 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
This rule has some options.
{
"vue/script-indent": ["error", TYPE, {
"baseIndent": 0,
"switchCase": 0,
"ignores": []
}]
}
TYPE(number | "tab") ... The type of indentation. Default is2. 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 is0.switchCase(integer) ... The multiplier of indentation forcase/defaultclauses. Default is0.ignores(string[]) ... The selector to ignore nodes. The AST spec is here (opens new window). You can use esquery (opens new window) to select nodes. Default is an empty array.
Note
This rule only checks .vue files and does not interfere with other .js files. Unfortunately the default indent rule when turned on will try to lint both, so in order to make them complementary you can use overrides setting and disable indent rule on .vue files:
{
"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>
# 👫 Related Rules
- indent (opens new window)
- vue/html-indent
- @typescript-eslint/indent (opens new window). The
vue/script-indentrule does not understand TypeScript AST. Please use@typescript-eslint/indentrule instead of this one inside of<script lang="ts"
# 🚀 Version
This rule was introduced in eslint-plugin-vue v4.2.0