如何修复“请求的模块未提供名为'default'的导出项”？

Question

我正在使用 JS 和 Vue.js 开发应用程序，但在该行上出现了错误：

import Vue from 'vue'

我得到以下错误：

Uncaught SyntaxError: 请求的模块'/node_modules/.vite/vue.js?v=6dba2ea6'未提供名为'default'的导出项

我通过谷歌得知这可能是由于旧版Vue版本引起的，在我的package.json中Vue版本为3.2.6，但是

npm view vue version

返回2.6.14，我尝试使用Vue CLI进行升级

vue upgrade

但是npm命令仍然返回2.6.14

我希望你能帮助我，我做错了什么，还是这不是版本问题？谢谢！

- Zixel

---

我在使用Vue 3时遇到了同样的问题。我将我的Node版本更新到了18。 - undefined

Answer 1

它无法正常工作的原因是Vue提供了一个“命名”导出，而你尝试将其导入为具有“默认”导出的模块。如果需要使用“命名”导出，则必须进行“命名”导入，需要在花括号中包含要导入的导出名称，就像这样将花括号 {} 包裹在 Vue 命名前：

import { Vue } from 'vue';
      // ^^^ name of export

它会起作用。

你想做的事情是导入vue，但它没有默认的导出函数，或者默认导出的东西没有在vue模块中设置。因此，你必须通过添加花括号来选择名为vue的函数。

如果有一个default导出函数，那么你的代码就可以工作，在这种情况下，你可以像下面这样写任何内容来代替vue：

import anyname from 'vue'

anyname是你想要的任何名称。

- jass

---

你的回答可以通过提供更多支持信息来改进。请编辑以添加进一步的细节，例如引用或文档，以便他人可以确认你的答案是正确的。您可以在帮助中心中找到有关如何编写良好答案的更多信息。 - Community

Answer 2

这对我有用：

import * as Vue from 'vue';

同样地，对于不同的软件包也是如此：

import * as Vuex from 'vuex';
import * as VueRouter from 'vue-router';

截至撰写本文时，以下为最新情况：

"devDependencies": {
       ...
        "vue": "^3.2.45",

- cookie

Answer 3

通常情况下，在Vue 2中，我们在src/main.js文件中通过调用new Vue作为创建应用程序实例的构造函数来引导应用程序。

import Vue from "vue";
import App from "./App.vue";
import router from './router'

const app = new Vue({
  router,
  render: h => h(App)
});

对于Vue 3，初始化代码语法已经改变，更加简洁和紧凑。

import { createApp } from "vue";

createApp(App).use(store).mount('#app')

- Kibiku Brian

Answer 4

另一种解决方案是使用createApp()函数，如下所示：

import { createApp } from 'vue';
createApp(App).mount('#app')

我对Vue.js没有经验，但看起来他们不再导出单个对象，而是一组东西。

- Sthe