CODEWITHSUNDEEP
vue.jsintellij-idea
user3667111
user3667111

Reputation: 631

Intellij Vue project change indentation level after <script> tags

So I work in a team that predominantly uses VSCode for the front-end work, I use Intellij myself as that's what I'm comfortable with. Issue is that when I go to format the code using Intellij it adds an initial indent to the code within <script> and <style> tags, it's not the worlds biggest issue - just a bit of a pain in the arse.

Their code would look like this:

<script lang="ts">
import { Component, Prop, Vue } from 'vue-property-decorator';
@Component
export default class CollapsibleSection extends Vue {
    @Prop() public index: any;
    @Prop() public value: any;

    public isActive() {
        return this.index === this.value;
    }
}
</script>

My code would look like this:

<script lang="ts">
    import {Component, Prop, Vue} from 'vue-property-decorator';
    @Component
    export default class CollapsibleSection extends Vue {
        @Prop() public index: any;
        @Prop() public value: any;

        public isActive() {
            return this.index === this.value;
        }
    }
</script>

Upvotes: 1

Views: 451

Answers (1)

lena
lena

Reputation: 93848

This will be fixed in the next major release, 2020.2, see WEB-30382.

For now, please try adding both script and style to the list of Do not indent children of in Settings | Editor | Code Style | HTML | Other

Upvotes: 2

Related Questions