JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 82
  • Score
    100M100P100Q76414F
  • License MIT

Laravel Mix extension to compile EJS templates

Package Exports

  • laravel-mix-ejs
  • laravel-mix-ejs/src/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (laravel-mix-ejs) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Laravel Mix EJS npm version GitHub license

This extention provides a method to compile EJS templates, in which the mix function is available.

Installation

With laravel-mix@>=6

$ npm install --save-dev laravel-mix-ejs

With laravel-mix@<6

$ npm install --save-dev laravel-mix-ejs@1

Usage

const mix = require('laravel-mix')

require('laravel-mix-ejs')

mix.ejs(
  'src/templates',
  'dist',
  {},
  { base: 'src/templates' }
)

API

ejs(from, to, data, options)

from

Type: string | string[]

Paths or glob patterns to files and directories to be copied.

to

Type: string

Destination path for copied files and directories.

data

Type: object

Overwrites the parameters used in the templates.

mix.ejs(
  'src',
  'dist',
  { title: 'Foo' },
  { base: 'src' }
)
<!-- Input: src/index.ejs -->
<% const heading = 'Bar' %>
<!DOCTYPE html>
<html>
  <head>
    <title><%= title %></title>
  </head>
  <body>
    <h1><%= heading %></h1>
  </body>
</html>

<!-- Output: dist/index.html -->
<!DOCTYPE html>
<html>
  <head>
    <title>Foo</title>
  </head>
  <body>
    <h1>Bar</h1>
  </body>
</html>

Contains the following parameters by default since v2.

[>= v2] mix(filePath)

The mix function. It returns a hashed file path in mix-manifest.json.

Note: Currently, hashes are output only when Laravel Mix versioning is enabled and in production mode. If needed in development mode as well, please use this way.

mix
  .setPublicPath('dist')
  .version()
  .js('src/js/app.js', 'dist/js')
  .sass('src/sass/app.scss', 'dist/css')
  .ejs(
    'src/templates',
    'dist',
    {}, // The `mix` function is provided by default since v2
    { base: 'src/templates' }
  )
<!-- Input: src/templates/index.ejs -->
<!DOCTYPE html>
<html>
  <head>
    <link rel="stylesheet" href="<%= mix('/css/app.css') %>" />
  </head>
  <body>
    <script src="<%= mix('/js/app.js') %>"></script>
  </body>
</html>

<!-- Output: dist/index.html -->
<!DOCTYPE html>
<html>
  <head>
    <link rel="stylesheet" href="/css/app.css?id=5idpn5fikyiybmyajdwnzh4wjx3ufe98" />
  </head>
  <body>
    <script src="/js/app.js?id=9au3gcbe9z8fagg7x6i4ifsmbuur49ig"></script>
  </body>
</html>
[>= v2] webpackCompilation
[>= v2] webpackConfig

options

Type: object

In addition to the EJS options, the following properties can also be set.

base

Type: string
Default: ''

When a path to a directory is set, the directory will be copied with the hierarchical structure kept.

// src/foo/bar.ejs -> dist/bar.html
mix.ejs(
  'src',
  'dist'
)

// src/foo/bar.ejs -> dist/foo/bar.html
mix.ejs(
  'src',
  'dist',
  {},
  { base: 'src' }
)
ext

Type: string
Default: '.html'

Changes the output file extension.

// src/index.ejs -> dist/index.html
mix.ejs(
  'src',
  'dist',
  {},
  { base: 'src' }
)

// src/index.ejs -> dist/index.php
mix.ejs(
  'src',
  'dist',
  {},
  {
    base: 'src',
    ext: '.php'
  }
)
partials

Type: string | string[]
Default: []

Paths set to this option will be watched but not output. Use for partial templates that are used with include().

// src/partials/header.ejs -> dist/partials/header.html
mix.ejs(
  'src',
  'dist',
  {},
  { base: 'src' }
)

// src/partials/header.ejs -> No output
mix.ejs(
  'src',
  'dist',
  {},
  {
    base: 'src',
    partials: 'src/partials'
  }
)