2017-10-19 3 views
0

Mon composant se charge correctement, mais les styles ne se chargent pas et les événements ne se déclenchent pas. Je suis la documentation et aucune erreur n'est lancée mais il semble que je puisse manquer quelque chose de fondamental ici?Styles et événements ne fonctionnant pas dans le modèle marko

Voir modèle rendu avec res.marko:

import Explanation from "./components/explanation.marko"; 
<!DOCTYPE html> 
<html lang="en"> 
<head> 
    ... 
</head> 
<body> 
    ... 
    <include(Explanation, input.explanation) /> 
    ... 
</body> 
</html> 

explanation.marko file:

class { 
    onExplanationClick() { 
    console.log("Explanation clicked"); 
    } 
} 

style { 
    .explanation-paragraph { 
    color: red; 
    } 
} 

<div id="explanation" on-click('onExplanationClick')> 
    <for (paragraph in input.content)> 
    <p class="explanation-paragraph">${paragraph}</p> 
    </for> 
</div> 

côté serveur:

app.get("/explanation/:id", async function(req, res) { 
    var explanation = await findExplanation(req.params.id); 
    var template = require("../../views/explanation/explanation.marko"); 
    res.marko(template, { explanation, user: req.user }); 
}); 

également en utilisant marko/nœud et nécessitent marko/express.

+0

Pour votre information, vous n'avez pas besoin d'importer explicitement le composant 'Explanation'. Vous pouvez supprimer la déclaration 'import' et juste faire ce qui suit:

Répondre

2

Vous devez intégrer un bundler de module/asset pipeline. Dans l'exemple de l'application marko-express, nous utilisons Lasso (un pipeline d'actifs + bundler de module JavaScript).

Il y a aussi une autre exemple d'application qui intègre Webpack: https://github.com/marko-js-samples/marko-webpack

L'équipe Marko prend en charge les Lasso et Webpack, mais nous recommandons Lasso, car il est plus simple et requiert une configuration minimale.

S'il vous plaît jeter un oeil à l'application marko-express et ne hésitez pas à poser des questions dans notre Gitter salle de chat si vous êtes coincé: https://gitter.im/marko-js/marko

+0

Merci, je n'avais pas réalisé que Lasso était nécessaire pour cela, et merci pour le lien gitter aussi –