how to configure rollup vue3 environment

when I use rollup configure vue3 environment ,i run it then use the component in the html file,it happen error

the code below rollup.config.js this is rollup config file

const path = require('path')
const resolve = require('rollup-plugin-node-resolve')
const commonjs = require('rollup-plugin-commonjs')
const babel = require('rollup-plugin-babel')
const json = require('rollup-plugin-json')
const vue = require('rollup-plugin-vue')
const postcss = require('rollup-plugin-postcss')

const inputPath = path.resolve(__dirname,'./src/index.js')
const outputUmdPath = path.resolve(__dirname,'./dist/imooc.datav.js')
const outputEsPath = path.resolve(__dirname,'./dist/imooc.datav.es.js')

module.exports = {
  input:inputPath,
  output:[{
    file:outputUmdPath,
    format:'umd',
    name:'imoocDatav',
    globals: {
      vue: 'Vue'
    }
  },{
    file:outputEsPath,
    format:'es',
    globals: {
      vue: 'Vue'
    }
  }],
  plugins:[
    vue(),
    babel({
      exclude:'node_modules/**',
      presets: ["@vue/babel-preset-jsx"]
    }),
    
    resolve(),
   
    commonjs(),
    
    json(),
    // vue(),
    postcss({
      plugins:[]
    })
  ],
 external:['vue'] 
}

Test.vue this is vue3 component

<template>
  <div class="text">{{ aa }}</div>
</template>

<script>
export default {
  name: 'Test',
  setup() {
    const aa = 'hello';
    return {
      aa,
    };
  },
};
</script>

<style lang="scss" scoped>
.text {
  color: red;
}
</style>

index.js the code make an global component

import Test from './Test.vue'

export default function(Vue){
  Vue.component(Test.name,Test);
}

index.html this is html file

<!DOCTYPE html>
<html>
  <head>
    <title>imooc datav libs example</title>
    <script src="https://cdn.jsdelivr.net/npm/vue@3.0.0-beta.6/dist/vue.global.js"></script>
    <script src="../dist/imooc.datav.js"></script>
  </head>
  <body>
    <div id="app">
        {{message}} 
      
       <test></test>
    </div>
    
    <script>
       Vue.createApp({
         setup(){
           var message = 'hello world';
           return {
             message
           }
         }
       }).use(imoocDatav).mount('#app');
    </script>
  </body>
</html>

vue.global.js:4877 TypeError: Cannot read property 'aa' of undefined