Laravel Mix extension that generates HTML from Twig templates.
Install with npm:
npm i -D laravel-mix-twigTested on [email protected].
Base configuration of webpack.mix.js to make the extension work:
const mix = require('laravel-mix');
require('laravel-mix-twig');
mix.twig();By default it will search for Twig templates in ./resources/twig directory that isn't prefixed with underscore **/!(_)*.twig and try to generate HTML output to ./html.
You can configure extension with custom options as well.
| Key | Type | Default | Description | 
|---|---|---|---|
enabled | 
{Boolean} | 
true | 
Determines whether HTML should be generated. | 
dir | 
{String} | 
'__dirname.split('node_modules')[0]' | 
Path to project directory | 
root | 
{String} | 
'./resources/twig' | 
Path to root directory of Twig templates. | 
entries | 
{Array} | 
['**/!(_)*.twig'] | 
Match entries with glob. | 
output | 
{String} | 
'./html' | 
Path to HTML output. | 
data | 
{String} | 
'data/**/*.{y?(a|)ml,json}' | 
Path to YAML and/or JSON files in root directory. | 
dataExtend | 
{Object} | 
{} | 
Extend data manually. | 
replaceOutputPath | 
{String} | 
'' | 
Removes symbols in output path | 
flatten | 
{Boolean} | 
false | 
When enabled, all HTML will be placed in the output folder without preserving the directory structure. | 
loader * | 
Object | 
{} | 
twig-html-loader options. | 
html * | 
Object | 
{} | 
html-webpack-plugin options. | 
beautify | 
{Boolean|Object} | 
false | 
js-beautify options. | 
* marked options can had unexpected behavior. Please see example of advanced configurations below with explanations.
mix.twig({
    enabled: !mix.inProduction(), // Enabled in development mode only
    root: './dev/templates', // Change default root path
    entries: ['index.twig', 'entries/*.twig'], // Custom entries
    output: './pub/templates', // Generate output HTML to this path
    data: '**/*.y?(a|)ml', // Search all `*.yml` and/or `*.yaml` files in root directory
    dataExtend: {
        ENV_IS_PRODUCTION: mix.inProduction(), // Add the environment variable
    },
    flatten: true, // Don't preserve the output directory structure
    loader: { // Custom `twig-html-loader` options
        data: {}, // * Gets automatically generated object from files of `data` option
    },
    html: { // Custom `html-webpack-plugin` options
        filename: {String}, // * Will be overwritten for each `entries`
        template: {String}, // * Depends on each path of the template from the root and its name
    },
    beautify: { // Custom `js-beautify` options
        'end_with_newline': true,
        'indent_inner_html': true,
        'preserve_newlines': false,
    },
});This project is licensed under the MIT License — see the LICENSE file for details.