Экспорт vuejs компонентов для повторного использования - PullRequest
Новая
       7

Экспорт vuejs компонентов для повторного использования

3 голосов
/ 12 января 2020

Я создал API. И для него я создал одностраничный интерфейс, используя vuecli. Мои планы заключаются в том, чтобы включить его в проекты, которые мне нужны. Вопрос в том, что нужно сделать, чтобы экспортировать письменное приложение и повторно использовать его при необходимости?

Структура проекта показана на скриншоте.

enter image description here

  • src/main.js - подключить и настроить топор ios
  • src/App.vue - я опишу основной компонент приложения (возможно, мне нужно поместить его в отдельный компонент в папке компонентов)
  • src/components/OneDay.vue - это второй компонент, который в основном называется src/App.vue несколько раз.
  • src/mixins/dateHandler.js - несколько функций, общих для двух компонентов, которые связаны как mixins.

Я не изменял другие файлы. Как я могу подготовить это правильно, чтобы я мог подключить эти компоненты к другим моим приложениям, используя composer? Я подключаюсь, настраиваю некоторые переменные (например, адрес API) и отображаю их в нужном месте на странице - вот как я это вижу.

1 Ответ

3 голосов
/ 12 января 2020

Вы можете попытаться создать веб-компонент, используя VUE CLI 3, чтобы использовать его позже в другой базе кода. Просто убедитесь, что ваш main.js файл выглядит следующим образом 

import Vue from 'vue';
import wrap from '@vue/web-component-wrapper';
import VueWebComponent from './components/VueWebComponent';

const CustomElement = wrap(Vue, VueWebComponent);

window.customElements.define('my-custom-element', CustomElement);

и постройте его, используя vue-cli-service build с --target wc

. Там вы можете прочитать более точные инструкции: https://github.com/vuejs/vue-web-component-wrapper https://vuejsdevelopers.com/2018/05/21/vue-js-web-component/

...