在使用Vue開發(fā)過程中，經(jīng)常會(huì)有需要引入公共文件的情況。公共文件一般是指多個(gè)組件共同依賴的文件，如樣式、腳本等。

Vue提供了多種方式引入公共文件，下面將分別介紹。

1.使用global：

Vue.mixin({
created: function () {
//在每個(gè)組件實(shí)例下都添加了這個(gè)方法
this.$styles = function (url) {
document.write('');
};
}
});

通過在Vue的mixin中添加$styles方法，然后在組件中使用this.$styles(url)方式引入外部樣式。

2.使用provide/inject：

// 公共樣式文件
const styleMixin = {
data () {
return {
styleUrl: 'common.css'
}
}
}
// 注入
new Vue({
provide () {
return {
styleMixin
}
}
});
// 使用
this.styleMixin.styleUrl;

先創(chuàng)建一個(gè)常量styleMixin，其中寫入公共樣式文件的信息。然后通過Vue的provide/inject方式向子組件傳遞常量?jī)?nèi)容，子組件中使用this.styleMixin.styleUrl方式調(diào)用公共樣式文件。

3.使用Vue.use：

import Vue from 'vue'
Vue.use({
install: function (Vue) {
Vue.prototype.$styles = function(url) {
document.write('');
};
}
})
// 使用
this.$styles(url)

使用Vue.use方法添加全局方法，然后在組件中通過this.$styles(url)方式調(diào)用方法即可。

以上三種方式都可以實(shí)現(xiàn)引入公共文件，使用的時(shí)候可以根據(jù)實(shí)際情況進(jìn)行選擇。