Question

我很疯狂，试图将Vue 3 CLI输出调和为可与所有都使用Vue对象的各种教程和插件一起使用的东西，例如Vue.createApp(...。在我的项目中，我可以使用

import {createApp} from 'vue';
createApp(...

但是import Vue from 'vue';导致Vue仍未定义。我通过NPM安装了Vue 3。显然，对于NPM导入我有一个我不了解的关键问题，如果导入整个模块不起作用，{createApp}导入又如何工作？

来自package.json：

"dependencies": {
    "@babel/polyfill": "^7.12.1",
    "apexcharts": "^3.22.1",
    "core-js": "^3.6.5",
    "d3": "^6.2.0",
    "vue": "^3.0.0",
    "vue-router": "^4.0.0-rc.1",
    "vue3-apexcharts": "^1.0.0"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "~4.5.0",
    "@vue/cli-plugin-eslint": "~4.5.0",
    "@vue/cli-service": "~4.5.0",
    "@vue/compiler-sfc": "^3.0.0",
    "babel-eslint": "^10.1.0",
    "babel-plugin-transform-regenerator": "^6.26.0",
    "eslint": "^6.7.2",
    "eslint-plugin-vue": "^7.0.0-0"
  },

这是我的临时main.js。这将打印“ undefined”，然后打印正确的createApp函数定义：

import Vue from 'vue';
import {createApp} from 'vue';
console.log(Vue);   
console.log(createApp);

Answer 1

如果您正在使用CDN，Vue可以用作全局变量，可以通过调用createApp之类的方法Vue.createApp({...})来创建实例，但是如果您正在使用CDN使用npm模块的捆绑程序，没有从Vue模块导入的vue对象，因此您应该从其中导入createApp来创建一个新实例，例如：

 import {createApp} from 'vue';
 let app=new createApp({...})
 app.use(somePlugin)
 app.mount("#app")

有关更多详细信息，请查看global API的迁移指南

Vue.js 3：无法导入Vue全局对象

1 个答案: