@RudMa

Как правильно подключить vue компонент к странице?

подскажите как правильно подключить скрипт компонента только на необходимой странице? В webpack есть входная точка index.js, если я подключаю vue-компонент в нем, все работает отлично. Но при этом этот скрипт подключается на все страницы, чего мне нужно избежать.
При вынесении этого подключения в отдельный файл js
import { createApp } from "vue";
import App from "./App.vue";
import store from "./vuex/store.js";

createApp(App)
  .use(store)
  .mount("#app-cart");

в консоли возникает такая проблема:

Failed to resolve module specifier "vue". Relative references must start with either "/", "./", or "../"


и необходимый компонент не отображается на странице Как мне решить эту проблему?

это мой шаблон pug, где я инлайню скрипт

- var pageName = "Front"
doctype html
html(lang="ru")
  block head
    ......
  body
    .......
      include components/header
      include components/footer
      block header
        +header-var
      block title
      block content
        .wrap
          .content
            ........
      block footer
        +footer-var
      include components/popups
    ......
    script(type="module", src="assets/js/cart-vue.js")
  • Вопрос задан
  • 61 просмотр
Решения вопроса 1
Aetae
@Aetae
Тлен
Скрипт которой лежит в assets и инланится просто в html - не компилируется webpack'ом и подключается как есть. Очевидно, что нифига не будет работать.
Тебе нужно добавить дополнительный entry для вебпака, чтоб он скомпилировал результат. Или сделать отдельный webpack проект для этого скрипта.
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы