eep_page/packages/index.js

import Vue from 'vue';
import '@/styles/font/font.css';
import '@/styles/common.scss';

import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';

import '@/icons';
import '@/utils/directive';
import '@/styles/index.scss';
import '@/utils/filter';

import '@/utils/mathjax'; // 必须在引入mathjax前引入mathjax的配置文件
import 'mathjax/es5/tex-mml-svg';

import VueSignaturePad from 'vue-signature-pad';

import BookEep from './BookEep.vue';
import pkg from './package.json';
import { setRuntimeServices } from '@/utils/runtime-services';
import EepSvgIcon from '@/common/SvgIcon';

const components = [BookEep];
const version = pkg.version;

Vue.use(ElementUI, {
  size: 'small',
});
Vue.use(VueSignaturePad);

// 定义 install 方法，接收 Vue 作为参数。如果使用 use 注册插件，则所有的组件都将被注册
const install = (VueInstance, options = {}) => {
  if (install.installed) return;
  install.installed = true;

  // 在 BookEep 组件子树内强制 SvgIcon 解析到库内实现，避免宿主全局同名组件覆盖
  // 必须无条件覆盖：Vue 2 的 $options.components 通过原型链继承全局组件，
  // 用 if 守卫会导致永远跳过后注册的覆盖逻辑。
  if (!VueInstance.__EEP_UI_ICON_MIXIN_INSTALLED__) {
    VueInstance.__EEP_UI_ICON_MIXIN_INSTALLED__ = true;
    VueInstance.mixin({
      beforeCreate() {
        if (this.$options.name === 'BookEep') {
          this.__eepUiScope = true;
        } else if (this.$parent && this.$parent.__eepUiScope) {
          this.__eepUiScope = true;
        }

        if (!this.__eepUiScope) return;

        const components = this.$options.components || (this.$options.components = {});
        // 无条件覆盖，因为 Vue 2 的 $options.components 继承自全局 Vue.options.components，
        // 宿主已注册的 SvgIcon 会出现在原型链上，导致 if (!components.SvgIcon) 永远为 false
        components.EepSvgIcon = EepSvgIcon;
        components.SvgIcon = EepSvgIcon;
      },
    });
  }

  setRuntimeServices({
    router: options.router,
    store: options.store,
  });

  components.forEach((component) => {
    VueInstance.component(component.name || 'BookEep', component);
  });
};

// 判断是否是直接引入文件,如果是，就不用调用 Vue.use()
if (typeof window !== 'undefined' && window.Vue) {
  install(window.Vue);
}

if (typeof window !== 'undefined') {
  window.__EEP_UI_VERSION__ = version;
}

// 导出的对象必须具有 install，才能被 Vue.use() 方法安装
export default {
  install,
  version,
};

export { version };