Как мне обратиться к пользовательскому файлу Javascript в моем проекте Vuepress, чтобы функции JS были доступны по всему миру?

Question

Я работаю над проектом Vuepress, который был настроен бывшим коллегой. Я пытаюсь передать свой пользовательский файл Javascript в корневой компонент, чтобы он был доступен по всему миру. Я не хочу ссылаться на него в каждом компоненте, потому что это было бы излишним и не работает должным образом.

Я читал, что EnlashApp.js - путь, поэтому я попытался прикрепить файл JS к Vue Object, но он не работает. Любая помощь приветствуется!

Это ImproveApp.js

import HelpersPlugin from '../../src/js/helpers';
export default ({
 Vue,
 options,
 router, // the router instance for the app
 siteData // site metadata
}) => {
Vue.use(HelpersPlugin);
}

это папка src / js / helpers, которая содержит, accordion.js (мой пользовательский файл JS) и index.js

index.js:

import AccordionHelper from './accordion';
export default { 
install: (Vue, options) => {
  Vue.prototype.$helpers = {
   accordion: AccordionHelper
  }
 }
}

accordion.js: (имеет простой JS с функциями манипулирования DOM)

export default () => {
    console.log("Hello");
    //DOM manipulation JS
}

Это структура папок:

docs
    -> .vuepress
        - components
            * Accordion.vue
            * Buttons.vue
        - theme
            * Layout.vue
            * SearchBox.vue
        - config.js
        - enhanceApp.js
    -> accordion
        - README.md
    -> buttons
        - README.md
src
    -> js
        - helpers
            * accordion.js
            * index.js

Я хочу использовать accordion.js в Accordion.vue и Layout.vue без необходимости ссылаться на него в обоих компонентах.

Answer 1

Я считаю, что это рекомендуемый способ обмена общими функциями JS. Нашел это, удалив тему по умолчанию из Vuepress.

Файл.vue:

<template>
  <div v-if="canHelp()">Help is on the way</div>
</template>

<script>
import { canHelp } from './helpers'
export default {
  methods: {
    canHelp
  }
}
</script>

helpers.js

export function canHelp () {
    return true
}