Что не так с экспортом моего упакованного компонента nue vpm?

Question

У меня есть небольшой локальный пакет npm (fomantic-ui-vue), основной js которого равен

import Vue from 'vue'
// Import vue component
import  button from './elements/button/button.vue'
import  buttonGroup from './elements/button/button-group.vue'

console.log('--------- package called begin ------------------');
console.log('Register: '+button.name)
Vue.component(button.name, button);
console.log('Register: '+buttonGroup.name)
Vue.component(buttonGroup.name, buttonGroup);
console.log('--------- package called end ------------------');

export const components = {
        button,
        buttonGroup,
    };
export const test = () => {
    console.log('--------- TEST ------------------');
};

В моем тестовом приложении у меня есть

import FUI from '../../fomantic-ui-vue/dist/main.js'
console.log(FUI)
FUI.test()

1. Первыйстрока должна быть как-то правильной, потому что в оболочке браузера я вижу package called begin и так далее.
2. console.log(FUI) дает {}. Где тест и компоненты?
3. для FUI.test() Я получаю ошибку TypeError: _fomantic_ui_vue_dist_main_js__WEBPACK_IMPORTED_MODULE_2___default.a.test is not a function Откуда взялся a? что не так?
4. Если я комментирую FUI.test(), чтобы избежать ошибки, я получаю сообщение об ошибке, что компонент vue fue-button не зарегистрирован, поэтому я делаю вывод, что пакет npm зарегистрировал его в другом месте

Это много ошибок, но я думаю, что они все связаны.

РЕДАКТИРОВАТЬ

const myTest = () => {
    console.log('--------- TEST ------------------');
};

export default {
    test: myTest,
    components: {
        button,
        buttonGroup
    }
};

Answer 1

Решение состоит в том, чтобы добавить library и libraryTarget в webpack.config.js:

module.exports = {
  entry: './src/index.js',
  output: {
    library: 'fomantic-ui-vue',
    libraryTarget: 'umd',
    filename: 'main.js',
    path: path.resolve(__dirname, 'dist'),
  },

Answer 2

Вы используете экспорт имени, поэтому для использования функции test вы должны импортировать ее следующим образом:

import {test} from '../../fomantic-ui-vue/dist/main.js';

Если вы хотите использовать его с точкойОбозначение в вашем main.js экспорте должен быть объектом с каждым ключом, ссылающимся на функции:

...
const myTestFunc = () => 'test';
const aComponent = () => Vue.component(..);

export default {
   test: myTestFunc,
   component: aComponent
}

Надеюсь, это поможет