Невозможно использовать библиотеку компонентов Vue с ссылкой npm - PullRequest
1 голос
/ 05 июля 2019

Я создаю приложение Vue и библиотеку компонентов Vue одновременно.Итак, я хотел бы настроить библиотеку со ссылкой на npm, чтобы мне не приходилось публиковать свой пакет библиотеки и переустанавливать его в моем основном приложении.

Мой пакет будет называться @ company / vue.Я могу опубликовать его на npm и установить / использовать в моем приложении Vue следующим образом:

import Vue from 'vue';
import VueComponents from '@company/vue';

Vue.use(VueComponents);

И это прекрасно работает.Я могу получить доступ к компонентам в моих файлах .vue и всем прочем.

Однако, если я буду следовать стандартным шагам для привязки моей библиотеки:

  1. путь к диску / к / библиотеке
  2. ссылка npm
  3. путь к CD / к / приложению
  4. ссылка npm @ company / vue

При запуске режима dev я получаю это предупреждение:

«экспорт» по умолчанию (импортированный как «VueComponents») не найден в «@ company / vue»

И, конечно, ничего на странице не загружается.

IДолжны ли вы представить, что я, возможно, связываю это неправильно?

Мой скрипт сборки выглядит так:

vue-cli-service build --no-clean --target lib --name company-vue src/index.js

И мой index.js, к которому он относится:

import './index.scss';

import * as components from './components/index.js';

const CompanyVue = {
    install(Vue) {
        if (this.installed) {
            return;
        }

        this.installed = true;
        for (let name in components) {
            Vue.use(components[name]);
        }
    }
};

let GlobalVue = null;

if (typeof window !== 'undefined') {
    GlobalVue = window.Vue;
}
else if (typeof global !== 'undefined') {
    GlobalVue = global.Vue;
}

if (GlobalVue) {
    GlobalVue.use(Plugin);
}

export * from './components';
export default CompanyVue;

Это просто стандартный способ, которым я видел большинство библиотек. И снова, он работает нормально, если я извлекаю пакет из npm.

Это то, что связано с моим пакетом в моем пакете.json:

"files": [
  "dist",
  "src",
  "!src/**/*.spec.js",
  "!src/**/*.stories.js"
],
"main": "./dist/company-vue.common.min.js",
"module": "./dist/company-vue.umd.min.js",
"browser": "./dist/company-vue.umd.min.js",
"unpkg": "./dist/company-vue.umd.min.js",

И, наконец, моя настройка babel для библиотеки компонентов:

module.exports = {
    presets: ['@babel/preset-env'],
    env: {
        test: {
            presets: [[
                '@babel/preset-env',
                {
                    targets: { node: "current" }
                }
            ]]
        }
    }
}
...