Repro

.prettierrc

@@ -1,4 +1,5 @@
 {
+  "tabWidth": 2,
   "printWidth": 120,
   "semi": true,
   "singleQuote": true

.vscode/settings.json

@@ -1,5 +1,6 @@
 // Place your settings in this file to overwrite default and user settings.
 {
   "vetur.validation.template": false,
-  "prettier.eslintIntegration": true
+  "vetur.format.options.tabSize": 4,
+  "vetur.format.options.useTabs": true
 }

client/components/Counter.vue

@@ -1,38 +1,34 @@
 <template>
   <div class="counter-wrapper">
     <div>{{ msg }}</div>
-    <div>
-      <img src="https://vuejs.org/images/logo.png" width="200" height="200" />
-    </div>
-    <div class="counter">
-      {{ count }}
-    </div>
-    <button @click="$store.commit('INCREMENT')">Increment</button>
-    <button @click="$store.commit('DECREMENT')">Decrement</button>
-    <button @click="$store.dispatch('incrementAsync')">Increment Async</button>
-  </div>
+    <div><img src="https://vuejs.org/images/logo.png" width="200" height="200" /></div>
+    <div class="counter">{{ count }}</div>
+    <button @click="$store.commit('INCREMENT');">Increment</button>
+    <button @click="$store.commit('DECREMENT');">Decrement</button>
+    <button @click="$store.dispatch('incrementAsync');">Increment Async</button>
+      </div>
 </template>
 
 <script>
-import * as _ from 'lodash'
+import * as _ from 'lodash';
 
 export default {
-  data () {
+      data() {
     return {
       msg: 'Vetur means "Winter" in icelandic.'
-    }
+    };
   },
   computed: {
-    count () {
-      return this.$store.state.count
+    count() {
+      return this.$store.state.count;
     }
   },
   methods: {
-    hello () {
-      console.log(this.msg)
+    hello() {
+      console.log(this.msg);
     }
   }
-}
+};
 </script>
 
 <style lang="scss" scoped>