How set up Vue 3 main.js file with extra imports-CodePudding

Hi I'm trying to start a new project using vue 3,I'm trying to do the vue 3 version of main.js file that works in vue 2

import GlobalMethods from './utils/globalMethods';

Vue.prototype.$GlobalMethods = GlobalMethods;

I try this:

app.config.$GlobalMethods = GlobalMethods;

but the screen is blank and I have this error in console:

Cannot read properties of undefined (reading 'use')

CodePudding user response：

In Vue 3, the app.config object has been removed and you can use the app.use() function to add global plugins to your application. The code you provided would be updated to look like this:

import { createApp } from 'vue';
import GlobalMethods from './utils/globalMethods';

const app = createApp({
  // app options here
});

app.use(GlobalMethods);

This will add the GlobalMethods plugin to your application and make it available on the app instance.

You can also add the GlobalMethods plugin directly to the createApp call like this:

import { createApp } from 'vue';
import GlobalMethods from './utils/globalMethods';

const app = createApp({
  // app options here
  setup() {
    return {
      GlobalMethods,
    };
  },
});