Отложенная загрузка скрипта

я хочу сделать подключение vue компонента через id на странице с подключаемым скриптом. Что-то типо этого

.cell.cell-xl-8
    #app-cart(data-url="http://localhost:3000/products")
          script.
            window.onload = function() {
              import {createApp} from "vue";
              import App from "./app-cart.vue";
              import store from "./vuex/store.js";

              let cartApp = document.querySelector("#app-cart");

              if (cartApp) {
                createApp(App, { props: ["data-url"] }).use(store).mount("#app-cart");
              }
            };

но при загрузке в консоли

Cannot use import statement outside a module

если я добавляю скрипту атрибут type="module", то следующая ошибка в консоли

Unexpected identifier

если мне вынести все import в общий файл index.js, который подключается webpackom в конец страницы, то он не может инициализировать createApp. Тогда как сделать отложенную загрузку для этого скрипта? Подскажите, я в тупике