Multi Platform Template System
This is html and xml template system. It is created to be used in multiple programming languages.
It’s like Twig, but better.
Table of content
Demo
https://greencodestudio.github.io/mpts/demos/js/
Examples
Real working examples available on github
Usage in code
PHP
# Install the MPTS library using Composer
composer require mkrawczyk/mpts
// Import necessary classes from the MPTS library
use MKrawczyk\Mpts\Environment;
use MKrawczyk\Mpts\Parser\XMLParser;
// Parse the MPTS template file
$template = XMLParser::Parse(file_get_contents(__DIR__ . '/file.mpts'));
// Create a new environment and set variables
$env = new Environment();
$env->variables = ['foo' => 'bar'];
// Execute the template with the environment and output the result
echo $template->executeToString($env);
More in Php’s repository and Packagist
JS
// Parse the MPTS template code
let parsed = XMLParser.Parse(code);
// Create a new environment and set variables
let env = new Environment();
env.variables = {foo: 'bar'};
// Execute the template with the environment and append the result to the document body
document.body.append(parsed.execute(env));
JS with webpack
webpack.config.js:
module.exports = {
module: {
rules: [
{
// Use the MPTS loader for files with the .mpts extension
test: /\.mpts$/,
loader: "mpts-loader",
},
],
},
};
and in code
// Parse the MPTS template code
import template from "./template.mpts";
// Execute the template with variables and append the result to the document body
document.body.append(template({foo: 'bar'}));
JS with VUE
webpack.config.js:
module.exports = {
module: {
rules: [
{
// Use the MPTS Vue loader for files with the .mpts extension
test: /\.mpts$/,
loader: "mpts-vue-loader",
},
],
},
};
and in code
<template>
<div>
<subcomponent/>
</div>
</template>
<script>
import subcomponent from "./subcomponent.mpts"
export default {
components:{subcomponent},
}
</script>
document.body.append(template({foo: 'bar'}))
Language supported
PHP
JS
Main package mpts-core
Webpack loader: mpts-loader
Webpack loader for Vue: mpts-vue-loader