Ошибка выражения альпийского выражения: карты не определены ⇐ Javascript

[Anonymous]

У меня есть view/Home.html:

Код: Выделить всё

Bienvenue sur SwiftDeli !

Commencez à créer et partager des recettes, ingrédients et listes de
courses.



[url=card.url]


[/url]

А это view/Home.js:

Код: Выделить всё

import template from "./Home.html?raw";
console.log("HTML Home View Loaded");

// Define the cards array
const cards = [
{
url: "/create-recipe",
title: "Ajouter une recette",
description: "Cliquez pour créer une nouvelle recette.",
},
{
url: "/recipes",
title: "Consulter les recettes",
description: "Cliquez pour voir toutes les recettes.",
},
{
url: "/groceries",
title: "Aller aux courses",
description: "Cliquez pour voir votre liste de courses.",
},
];

// Register the cards component with Alpine.js
document.addEventListener("alpine:init", () => {
console.log("Alpine.js initialized");
Alpine.data("cards", () => ({
cards: cards,
}));
});

// Initialize the component
export default () => ({
init() {
console.log("Home View Loaded");

// Inject the template into the DOM
const contentElement = document.getElementById("content");
contentElement.innerHTML = template;

// Initialize Alpine.js on the new content
Alpine.initTree(contentElement);
console.log("Alpine.js initialized on new content");
},
});

Я использую Vite, который, кажется, работает нормально, и вот мой main.js:

Код: Выделить всё

import Alpine from "alpinejs";
import Navigo from "navigo";

// Initialize Alpine.js
window.Alpine = Alpine;
Alpine.start();

// Initialize Navigo router
const router = new Navigo("/");

// Define views (dynamically loaded)
const views = {
home: () => import("./views/Home.js")
};

// Router setup
router.on({
"/": async () => {
const { default: Home } = await views.home();
const homeView = Home();
homeView.init();
},
"*": () => {
document.getElementById("content").innerHTML = "Page non trouvée";
},
});

router.resolve();

При загрузке домашней страницы я получаю ошибку выражения альпийского выражения: карты не определены . У меня есть ощущение, что переменная карт не передается в HTML, но мне интересно, как это проверить, и решить эту проблему. Я вижу свою макет просто отлично, только без карт.


Подробнее здесь: https://stackoverflow.com/questions/793 ... ot-defined