Совместное использование активов и компонентов между проектами Vue - PullRequest
Новая
       11

Совместное использование активов и компонентов между проектами Vue

0 голосов
/ 19 февраля 2019

У меня есть 2 приложения Vue, и им обоим нужно использовать некоторые общие страницы и ресурсы (файлы scss, значки и т. Д.).

Страницы, которыми они должны поделиться, - это полные страницы с доступом к vuex store и async.звонки.

То, что я думаю сделать, это создать одно приложение vue (с помощью cli) и поместить в него оба приложения и создать общую папку: 

vue-project
   - src
     - app1
     - app2
     - shared

Но тогда явозникли проблемы: как создать / запустить каждое приложение отдельно?

Ответы [ 2 ]

0 голосов
/ 25 февраля 2019

Вот что я в итоге сделал:

  • Я создал эту структуру 

    vue-project
    - node_modules
    - src
      - app1
      - app2
      - shared

  • Все узлы модуля находятся подvue-project, поэтому они являются общими

  • Не обязательно, но я определил псевдонимы для разных проектов: 

    ...
"@app1": path.resolve(__dirname, "src/app1"),
"@app2": path.resolve(__dirname, "src/app2"),
"@shared": path.resolve(__dirname, "src/shared/components")
...

  • Это важно дляобратите внимание, что при создании псевдонимов вы должны добавить символ '@', иначе вы можете получить неожиданные результаты.Для меня, прежде чем я добавил его, он загружал ресурсы из app2, хотя я использовал псевдоним app1

  • Я создал эти сценарии в package.json: 

    "serve:app1": "vue-cli-service serve --port 3000 --open  src/app1/main.js",
"serve:app2": "vue-cli-service serve --port 3001 --open  src/app2/main.js",
"build:app1": "vue-cli-service build --dest dist/console src/app1/main.js",
"build:app2": "vue-cli-service build --dest dist/tm src/app2/main.js"

    И это все, теперь у меня есть 2 отдельных приложения vue, которые запускают и делятся компонентами, модулями магазина и страницами.

0 голосов
/ 19 февраля 2019

Будет существовать решение для контроля уровня файлов / исходного кода, которое позволит вам синхронизировать копии общего компонента в двух проектах.Если вы используете Git, посмотрите на общие подмодули .

Здесь есть большой потенциал для кошмара.Вы описали это так хорошо, я думаю, что вы в тайне знаете.Повторно используемые компоненты (повторно используемые в проектах) не должны зависеть от хранилища vuex, которое зависит от приложения.Я хотел бы взглянуть на помещение вызовов магазина в компонент-оболочку, специфичный для проекта, а затем передавать их в общий компонент в качестве подпорки.По моему мнению, повторно используемые компоненты не должны взаимодействовать со своей средой, кроме реквизита и событий.

...