작성방법

두 가지 작성 방법이 존재한다. Object 생성 or Function 생성이 있다.

Object 생성

Object로 생성 시에는 install method를 구현하여야 한다.

const myPlugin = {
  install(app, options) {
    // configure the app
  }
};
export default myPlugin;

function 생성

export default function(app, options) {
	// confgure the app
}

Plugin 사용

// main.js
import myPlguin from './plugins/myPlugin';

const app = createApp(App);
app.use(myPlguin)

위 코드처럼 use Method를 통하여 Plugin을 등록한다.

간단한 Plugin 작성 및 사용 예제

// myPlugin.js
export default {
  install(app, options) {
    const person = {
      name: options.name, 
      say() {
        alert(this.name);
      },
    };
    app.config.globalProperties.$person = person; // vue instance로 접근 가능, 컴포넌트 생성 이후 접근가능 (created hook부터)
    app.provide('person', person); // inject로 접근가능 setup hook에서 사용가능
  },
};

// main.js
import myPlguin from './plugins/myPlugin';

const app = createApp(App);
app.use(myPlguin, {name: 'Half Road'}) // 2번째 인자는 options