Vue.prototype vs Vue.use vs import for each file

Question

These are some of the ways I know to create a global function to vue js project:

time.js

// if Vue.use()

export default {
  install: Vue => {
    Object.defineProperty(Vue.prototype, "time", {
       return new Date().getTime();
    })
  }
}

// else 

function time () {
  return new Date().getTime();
}

export { time }

main.js

...

import { time } from "time";

// if Vue.prototyp
Vue.prototype.$time = time 

// else if Vue.use()
Vue.use(time)

...

App.vue

// if Vue.prototype or Vue.use()
console.log(this.$time());

// else 
import { time } from "time";
console.log(time());

What is the best method for vue js project?

kissu · Accepted Answer · 2022-03-27 22:37:37Z

1

Use import rather than polluting the global scope.
You will not benefit from tree-shaking, will probably have collisions, it's harder to debug and probably some other drawbacks that I cannot think about right now.

answered Mar 27, 2022 at 22:37

kissu

47.3k16 gold badges94 silver badges196 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Vue.prototype vs Vue.use vs import for each file

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related