คอมไพเลอร์เลย์เอาต์ของเนื้อหา

ระบบใช้คอมไพเลอร์เลย์เอาต์เนื้อหาเพื่อส่งออก HTML สำหรับเลย์เอาต์เนื้อหาเมื่อมีการเผยแพร่รายการเนื้อหาของประเภทเนื้อหาที่ระบุ

ในระหว่างการคอมไพล์ คำสั่ง cec compile-content จะค้นหาไฟล์ compile.js ในตำแหน่งเดียวกับที่มีไฟล์ render.js สำหรับองค์ประกอบ:

• src
  • components
    • <yourComponent>
      • assets
        • render.js
        • compile.js

หากไม่มีไฟล์นี้ ระบบจะไม่คอมไพล์เลย์เอาต์และจะแสดงเลย์เอาต์ขณะรันไทม์

ในกรณีที่ไม่มีไฟล์ จะต้องใช้อินเตอร์เฟซ compile() ซึ่งแสดง Promise ตัวอย่างเช่น ต่อไปนี้คือคอมไพเลอร์เลย์เอาต์เนื้อหา ตามด้วยเอาต์พุต layout.html ที่ได้:

var fs = require('fs'),
        path = require('path'),
        mustache = require('mustache');

var ContentLayout = function (params) {
        this.contentClient = params.contentClient;
        this.contentItemData = params.contentItemData || {};
        this.scsData = params.scsData;
};

ContentLayout.prototype = {
        contentVersion: '>=1.0.0 <2.0.0',

        compile: function () {
                var compiledContent = '',
                        content = JSON.parse(JSON.stringify(this.contentItemData)),
                        contentClient = this.contentClient;

                // Store the id
                content.fields.author_id = content.id;

                if (this.scsData) {
                        content.scsData = this.scsData;
                }

                try {
                        // add in style - possibly add to head but inline for simplicity
                        var templateStyle = fs.readFileSync(path.join(__dirname, 'design.css'), 'utf8');
                        content.style = '<style>' + templateStyle + '</style>';

                        var templateHtml = fs.readFileSync(path.join(__dirname, 'layout.html'), 'utf8');
                        compiledContent = mustache.render(templateHtml, content);
                } catch (e) {
                        console.error(e.stack);
                }

                return Promise.resolve({
                        content: compiledContent,
                        hydrate: true
                });
        }
};

module.exports = ContentLayout;

สามารถใส่ layout.html ในเว็บแอปพลิเคชันหรือที่ใดก็ตามที่ึคุณต้องการเอาต์พุต HTML แบบสแตติกของเลย์เอาต์เนื้อหา layout.html คือเอาต์พุตไปยังไดเรคทอรีเดียวกันกับไฟล์ compile.js

{{{style}}}
{{#fields}}
<div class="author-container">
    <span class="author-name" onclick='{{scsData.contentTriggerFunction}}("starter-blog-post_author eq \"{{author_id}}\"")'>{{starter-blog-author_name}}</span>
{{/fields}}