Vite HMR doesn't preserve state in Vue 2 after component update

Question

When editing a component, the vue data state will reset after an hmr update.

<template>
  <div>
    {{ count }} <button @click="count++">increment</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      count: 0
    };
  }
};
</script>

Increment count 2 times and change the template (e.g. add another button). The count will display 0 again after an hmr update.

Try it here: https://stackblitz.com/edit/vite-vue2

Am i missing a vite.config.js setting, or is it something else?