vite.config.js => Uncaught SyntaxError: 不能在模块外使用 import 语句

Question

我用 $ npm install vue-app 创建了一个新的 repo 并创建了一些测试组件。

当我运行命令 $ npm run dev 时，应用程序在本地主机端口 3000 中启动。

我尝试在 WP 网站中添加我的组件。当我构建文件并添加到我的主题时，我收到消息：

未捕获的语法错误：不能在模块外使用导入语句

我找到了一些 webpack 的文档，但没有找到 vite.config.js。

有人可以帮忙吗？

vite.config.js

// vite.config.js
import vue from '@vitejs/plugin-vue'

export default {
    plugins: [vue()]
}

package.json

{
  "name": "vite-app",
  "version": "0.0.0",
  "type": "module",
  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "serve": "vite preview"
  },
  "dependencies": {
    "vue": "^3.0.5"
  },
  "devDependencies": {
    "@vitejs/plugin-vue": "^1.2.3",
    "@vue/compiler-sfc": "^3.0.5",
    "vite": "^2.3.5"
  }
}