Un compilador de diseño de página es un módulo NodeJS (CommonJS) de JavaScript que compila el diseño de página correspondiente.
El compilador de diseño de página de un diseño de página específico se define con la asociación de nombre a una extensión -compile.js:
src
themes
<yourTheme>
layouts
<yourPageLayout>.html<yourPageLayout>-compile.jsSi no existe ningún -compile.js para un diseño de página, no se aplicará ninguna compilación personalizada.
Un compilador de diseño de página debe implantar una interfaz compile(), que devuelve una promesa, como, por ejemplo, about-compile.js:
var mustache = require('mustache');
var PageCompiler = function () {};
PageCompiler.prototype.compile = function (args) {
var self = this,
layoutMarkup = args.layoutMarkup;
self.SCSCompileAPI = args.SCSCompileAPI;
return new Promise function (resolve, reject) {
var compiledPage = layoutMarkup,
id = self.SCSCompileAPI.navigationRoot;
// page is compiled so there is no FOUC, can remove the opacity
workaround
compiledPage = compiledPage.replace('opacity: 0;', 'opacity: 1;');
// remove the dynamic menu creation, we'll be compiling it here
compiledPage = compiledPage.replace('<script
src="_scs_theme_root_/assets/js/topnav.js"></script>', '');
// add link to Home page. . .
var homePageURL = (self.SCSCompileAPI.getPageLinkData(id) ||
{}).href;
if (homePageURL) {
compiledPage = compiledPage.replace('class="navbar-brand"
href="#"', 'class="navbar-brand" href="' + homePageURL + '"');
}
// build the menu and add it to the page
var navMenu = self.createNavMenu();
compiledPage = compiledPage.replace('<!-- navigation menu goes in
here -->', navMenu);
// return the compiled page
resolve(compiledPage);
});
};
// Create the navigation menu that was previously dynamically generated on
each page
PageCompiler.prototype.createNavMenu = function () {
. . .
}
module.exports = new PageCompiler();