Ich versuche, eine einzelne Seite Website mit Pug Templating-Engine und JSON als Datenbank zu erstellen. Letztendlich möchte ich meine verschiedenen "Seiten" in der JSON-Datei speichern und dann diesen JSON mit verschiedenen Variablen/Mixins in meiner Pug-Vorlage rendern, aber ich bekomme weiterhin die Fehler cannot read property "company" of undefined
.Pug - Schlüssel aus einem JSON-Objekt abrufen
Jede Hilfe würde sehr geschätzt werden.
Das ist meine Gulp Aufgabe meiner Mops-Dateien und Rohr der JSON in die Vorlage zu erstellen:
// build the Pug files into HTML
gulp.task('build-pug', function buildHTML(){
var dataFile = 'source/javascript/pages.json';
return gulp.src('source/**/*.pug')
.pipe(data(function(file){
return JSON.parse(fs.readFileSync(dataFile));
}))
.pipe(pug({
pretty: true
}))
.pipe(gulp.dest('public'))
.pipe(browserSync.reload({
stream: true
}));
});
Das ist meine pages.json
Datei:
{
"pages": [
{
"year": "2016",
"company": "Abacus",
"home": "./assets/images/2016/home/abacus.png",
"home-url": "http://abacus.com",
"login": "./assets/images/2016/login/abacus.png",
"login-url": "http://abacus.com/login",
"pricing": "./assets/images/2016/pricing/abacus.png",
"pricing-url": "http://abacus.com/pricing"
},
{
"year": "2016",
"company": "Alfred",
"home": "./assets/images/2016/home/alfred.png",
"home-url": "http://alfred.com"
}
]
}
Dies ist in meiner index.pug
Datei, in der Ich versuche, Schlüssel aus meinem JSON:
section.pricing
h1 Pricing Pages
div.content.pricing
each page in pages
p= page.pages.company
Nein so etwas wie ein JSON-Objekt. JSON ist ein Datenaustauschformat, d. H. Eine wohlgeformte * Zeichenkette *. –
Ah, tut mir leid. Ich lerne gerade Entwicklung und beziehe mich darauf wie das W3C. https://www.w3schools.com/js/js_json_objects.asp – jayjo
W3C ist eine * schreckliche * Ressource, diese Seite ist ein Beispiel dafür. Benutze MDN https://developer.mozilla.org/en-US/ –