rollup.js打包vue3组件库问题

Question

之前用vue3写了一个国籍/手机区号选择插件 ，使用的是rollup.js构建，经过我一番配置后可以构建成功，但构建出来后的js却不能使用，求大佬指点！！！

仓库git地址：vue3国籍/手机区号选择插件

打包出来后使用报错如下：

页面上的元素竟然没被编译？：

代码使用：

rollup.config.js配置：

import esbuild from 'rollup-plugin-esbuild'; // plugin-esbuild将ts变为js
import vue from 'rollup-plugin-vue'; // plugin-vue将vue结尾的文件变为js
// import css from 'rollup-plugin-css-only'; // 处理css
import styles from "rollup-plugin-styles"; // 提取css至单独的文件
// rollup-plugin-node-resolve 插件可以解决 ES6模块的查找导入，但是npm中的大多数包都是以CommonJS模块的形式出现的，所以需要使用这个插件将CommonJS模块转换为 ES2015 供 Rollup 处理
import nodeResolve from '@rollup/plugin-node-resolve'
import commonjs from 'rollup-plugin-commonjs';
import { terser } from "rollup-plugin-terser"; // 变丑别人看不懂（压缩后的）
import rollupReplace from '@rollup/plugin-replace'; // 替换代码中的某些变量
import babel from 'rollup-plugin-babel';

export default {
  input: 'src/components/Vue3CountryIntl.vue', // 输入文件
  // 输出，告诉rollup一些重要的信息
  output: {
    globals: {
      vue: 'Vue' // 我们的仓库实际依赖vue, vue是不需要打包的，所以这里说明我们用了一个全局变量vue
    },
    // assetDir: './assets',
    name: 'Vue3CountryIntl', // 仓库或组件的名字，如果使用<script>引入方式则为暴露在window对象下的全局的变量名称
    file: 'lib/vue3CountryIntl.js', // 我们要生成的文件目录（css是自动创建）
    format: 'es', 
    assetFileNames: "[name][extname]", // rollup-plugin-styles插件生成的css文件的名称
    plugins: [terser()] // 插件，（js的丑化，即打包后，不容易阅读的压缩后的文件）； 如果去掉terser()，得到的js代码即为容易阅读的
  },
  plugins: [
    nodeResolve(),
    vue({ // 引用的vue插件，即上述引入的插件使用一遍，以及添加一些选项
      include: /\.vue$/,
      // 把单文件组件中的样式，插入到html中的style标签
      css: false,
      // 把组件转换成 render 函数
      //compileTemplate: true
    }),
    /*postcss({
      extensions: [ '.css' ],
    }),*/

    styles({
      // mode: "extract",
      // ... or with relative to output dir/output file's basedir (but not outside of it)
      mode: ["extract", "vue3CountryIntl.css"],
      minimize: true, // 是否压缩文件
      url: {
        publicPath: './', // CSS 文件中 URL 的公共路径
        hash: '[name]-[hash].[ext]'
      }
    }),
    commonjs({
      include: 'node_modules/**', // 包括
      exclude: [],  // 排除
    }),
    // resolve(),
    rollupReplace({
      // 替换代码中的 process.env.NODE_ENV
      'process.env.NODE_ENV': JSON.stringify('production'),
      preventAssignment: true,
      /*__buildDate__: () => JSON.stringify(new Date()),
      __buildVersion: 15*/
    }),
    babel({
      exclude: 'node_modules/**' // 只编译我们的源代码
    }),
    esbuild({ // 对所有的js及ts进行编译，编译为ie支持的js(目标为es6)
      include: /\.[jt]s$/,
      // minify: process.env.NODE_ENV === 'production',
      // minify: true,
      minify: false,
      target: 'es2015'
    })
  ]
}