title: Vue.js 3: Cannot import Vue global object
body: <p>I'm going crazy trying to reconcile the Vue 3 CLI output into something that works with various tutorials and plugins that all use the Vue object, as in <code>Vue.createApp(...</code>. In my project, I can use</p>
  <pre><code>import {createApp} from 'vue';
  createApp(...
  </code></pre>
  <p>but <code>import Vue from 'vue';</code> results in Vue still being undefined. I have Vue 3 installed via NPM. Clearly there is something critical that I don't understand about NPM imports, how could the <code>{createApp}</code> import work if importing the whole module does not work?</p>
  <p>From package.json:</p>
  <pre><code>&quot;dependencies&quot;: {
      &quot;@babel/polyfill&quot;: &quot;^7.12.1&quot;,
      &quot;apexcharts&quot;: &quot;^3.22.1&quot;,
      &quot;core-js&quot;: &quot;^3.6.5&quot;,
      &quot;d3&quot;: &quot;^6.2.0&quot;,
      &quot;vue&quot;: &quot;^3.0.0&quot;,
      &quot;vue-router&quot;: &quot;^4.0.0-rc.1&quot;,
      &quot;vue3-apexcharts&quot;: &quot;^1.0.0&quot;
    },
    &quot;devDependencies&quot;: {
      &quot;@vue/cli-plugin-babel&quot;: &quot;~4.5.0&quot;,
      &quot;@vue/cli-plugin-eslint&quot;: &quot;~4.5.0&quot;,
      &quot;@vue/cli-service&quot;: &quot;~4.5.0&quot;,
      &quot;@vue/compiler-sfc&quot;: &quot;^3.0.0&quot;,
      &quot;babel-eslint&quot;: &quot;^10.1.0&quot;,
      &quot;babel-plugin-transform-regenerator&quot;: &quot;^6.26.0&quot;,
      &quot;eslint&quot;: &quot;^6.7.2&quot;,
      &quot;eslint-plugin-vue&quot;: &quot;^7.0.0-0&quot;
    },
  </code></pre>
  <p>Here is my temporary main.js. This prints 'undefined' followed by the correct createApp function definition:</p>
  <pre><code>import Vue from 'vue';
  import {createApp} from 'vue';
  console.log(Vue);   
  console.log(createApp);   
  </code></pre>