laravel-elixir-template
Advanced tools
This is a simple wrapper around gulp-template and gulp-htmlmin to substitute variables into a static HTML template using Laravel's Elixir.
My main usage for this is when developing VueJS apps and I just want to serve up a standard HTML file, rather than passing the request through to Laravel just because I want to use the versioned assets and thus needing the elixir() function in the blade templates. This gives you the ability to serve just the HTML file, without taking the performance hit by passing the request into PHP, and still make use of Elixir's versioned assets.
To install you just need to require the module after installing it with NPM.
npm install laravel-elixir-template
var elixir = require('laravel-elixir');
require('laravel-elixir-template');
elixir(function(mix) {
mix.template('template/*.html');
});
The most basic usage would just be to substitute the versioned asset paths into your template. By default it reads the manifest.json found within your build folder when versioning assets.
elixir(function(mix) {
mix.scss('app.scss')
.webpack('app.js')
.version(['app.css', 'app.js'])
.template('template/*.html');
});
<!doctype html>
<html lang="en">
<head>
<link rel="stylesheet" href="<%= css %>">
</head>
<body>
<script src="<%= js %>"></script>
</body>
</html>
You may also supply an output path, by default your public path is used. This example below will transfer your templates into web rather than your usual public folder.
elixir(function(mix) {
mix.scss('app.scss')
.webpack('app.js')
.version(['app.css', 'app.js'])
.template('template/*.html', 'web');
});
Extra variables may also be passed into the template function, and you don't have to version assets if you don't wish to.
elixir(function(mix) {
mix.template('template/*.html', 'public', {heroTitle: 'Hello World'});
});
<!doctype html>
<html lang="en">
<body>
<div class="hero">
<h1 class="hero-title"><%= heroTitle %></h1>
</div>
</body>
</html>
By default HTML will be minified if gulp is run with the --production argument.
Elixir.config.template.minify = false
Further options can be passed to the gulp-htmlmin plugin itself by settings variables on the options property of the template config. See the gulp-htmlmin for all the options you may pass here https://github.com/kangax/html-minifier#options-quick-reference
Elixir.config.template.options = {
removeComments: true,
collapseWhitespace: true
};
Copyright (c) 2016 Wade Urry Licensed under the MIT license.
FAQs
Substitute elixir versioned assets into a template
We found that laravel-elixir-template demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Ransomware payment rates hit an all-time low in 2024 as law enforcement crackdowns, stronger defenses, and shifting policies make attacks riskier and less profitable.
Security News
require(esm) backported to Node.js 20, easing the transition to ESM-only packages and reducing complexity for developers as Node 18 nears end-of-life.
Security News
PyPI now supports iOS and Android wheels, making it easier for Python developers to distribute mobile packages.