Property or method is not defined on the instance but referenced during rende

[mu-yu]

Created a project with @vue/cli 4.5.12, and then import this plugin followed by the readme.

after everything has been done, I run npm run serve , and shows the following error.

 vue.runtime.esm.js?2b0e:619 [Vue warn]: Property or method "counter" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property. See: https://vuejs.org/v2/guide/reactivity.html#Declaring-Reactive-Properties.

found in

---> <Home> at src/views/Home.vue
       <App> at src/App.vue
         <Root>
warn @ vue.runtime.esm.js?2b0e:619
warnNonPresent @ vue.runtime.esm.js?2b0e:2024
get @ vue.runtime.esm.js?2b0e:2079
render @ Home.vue?b723:5
eval @ vue-composition-api.esm.js?a6f4:1810
activateCurrentInstance @ vue-composition-api.esm.js?a6f4:1765
$options.render @ vue-composition-api.esm.js?a6f4:1809
Vue._render @ vue.runtime.esm.js?2b0e:3569
updateComponent @ vue.runtime.esm.js?2b0e:4081
get @ vue.runtime.esm.js?2b0e:4495
Watcher @ vue.runtime.esm.js?2b0e:4484
mountComponent @ vue.runtime.esm.js?2b0e:4088
Vue.$mount @ vue.runtime.esm.js?2b0e:8459
init @ vue.runtime.esm.js?2b0e:3137
merged @ vue.runtime.esm.js?2b0e:3322
createComponent @ vue.runtime.esm.js?2b0e:6022
createElm @ vue.runtime.esm.js?2b0e:5969
createChildren @ vue.runtime.esm.js?2b0e:6097
createElm @ vue.runtime.esm.js?2b0e:5998
patch @ vue.runtime.esm.js?2b0e:6521
Vue._update @ vue.runtime.esm.js?2b0e:3960
updateComponent @ vue.runtime.esm.js?2b0e:4081
get @ vue.runtime.esm.js?2b0e:4495
Watcher @ vue.runtime.esm.js?2b0e:4484
mountComponent @ vue.runtime.esm.js?2b0e:4088
Vue.$mount @ vue.runtime.esm.js?2b0e:8459
init @ vue.runtime.esm.js?2b0e:3137
createComponent @ vue.runtime.esm.js?2b0e:6022
createElm @ vue.runtime.esm.js?2b0e:5969
patch @ vue.runtime.esm.js?2b0e:6560
Vue._update @ vue.runtime.esm.js?2b0e:3960
updateComponent @ vue.runtime.esm.js?2b0e:4081
get @ vue.runtime.esm.js?2b0e:4495
Watcher @ vue.runtime.esm.js?2b0e:4484
mountComponent @ vue.runtime.esm.js?2b0e:4088
Vue.$mount @ vue.runtime.esm.js?2b0e:8459
eval @ main.ts?b26f:12
./src/main.ts @ app.js:1078
__webpack_require__ @ app.js:854
fn @ app.js:151
1 @ app.js:1151
__webpack_require__ @ app.js:854
checkDeferredModules @ app.js:46
(anonymous) @ app.js:994
(anonymous) @ app.js:997
Show 15 more frames
vue.runtime.esm.js?2b0e:619 

[Vue warn]: Property or method "count" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property. See: https://vuejs.org/v2/guide/reactivity.html#Declaring-Reactive-Properties.

found in

---> <Home> at src/views/Home.vue
       <App> at src/App.vue
         <Root>
warn @ vue.runtime.esm.js?2b0e:619
warnNonPresent @ vue.runtime.esm.js?2b0e:2024
get @ vue.runtime.esm.js?2b0e:2079
render @ Home.vue?b723:6
eval @ vue-composition-api.esm.js?a6f4:1810
activateCurrentInstance @ vue-composition-api.esm.js?a6f4:1765
$options.render @ vue-composition-api.esm.js?a6f4:1809
Vue._render @ vue.runtime.esm.js?2b0e:3569
updateComponent @ vue.runtime.esm.js?2b0e:4081
get @ vue.runtime.esm.js?2b0e:4495
Watcher @ vue.runtime.esm.js?2b0e:4484
mountComponent @ vue.runtime.esm.js?2b0e:4088
Vue.$mount @ vue.runtime.esm.js?2b0e:8459
init @ vue.runtime.esm.js?2b0e:3137
merged @ vue.runtime.esm.js?2b0e:3322
createComponent @ vue.runtime.esm.js?2b0e:6022
createElm @ vue.runtime.esm.js?2b0e:5969
createChildren @ vue.runtime.esm.js?2b0e:6097
createElm @ vue.runtime.esm.js?2b0e:5998
patch @ vue.runtime.esm.js?2b0e:6521
Vue._update @ vue.runtime.esm.js?2b0e:3960
updateComponent @ vue.runtime.esm.js?2b0e:4081
get @ vue.runtime.esm.js?2b0e:4495
Watcher @ vue.runtime.esm.js?2b0e:4484
mountComponent @ vue.runtime.esm.js?2b0e:4088
Vue.$mount @ vue.runtime.esm.js?2b0e:8459
init @ vue.runtime.esm.js?2b0e:3137
createComponent @ vue.runtime.esm.js?2b0e:6022
createElm @ vue.runtime.esm.js?2b0e:5969
patch @ vue.runtime.esm.js?2b0e:6560
Vue._update @ vue.runtime.esm.js?2b0e:3960
updateComponent @ vue.runtime.esm.js?2b0e:4081
get @ vue.runtime.esm.js?2b0e:4495
Watcher @ vue.runtime.esm.js?2b0e:4484
mountComponent @ vue.runtime.esm.js?2b0e:4088
Vue.$mount @ vue.runtime.esm.js?2b0e:8459
eval @ main.ts?b26f:12
./src/main.ts @ app.js:1078
__webpack_require__ @ app.js:854
fn @ app.js:151
1 @ app.js:1151
__webpack_require__ @ app.js:854
checkDeferredModules @ app.js:46
(anonymous) @ app.js:994
(anonymous) @ app.js:997
Show 15 more frames
vue.runtime.esm.js?2b0e:619 

[Vue warn]: Invalid handler for event "click": got undefined

found in

---> <Home> at src/views/Home.vue
       <App> at src/App.vue
         <Root>

Home.vue

<template>
  <div @click="counter">{{ msg }}: {{ count }}</div>
</template>

<script lang="ts" setup>
let count = 0
function counter() {
  count = count + 1
}
</script>

<script lang="ts">
export default {
  data() {
    return {
      msg: 'hello'
    }
  }
}
</script>