Add virtual templates

Author: paulrobertlloyd

docs/get-started.md

@@ -52,8 +52,6 @@ export default function(eleventyConfig) {
     dir: {
       // The folder where all your content will live:
       input: 'app',
-      // Use layouts from the plugin
-      layouts: '../node_modules/@x-govuk/govuk-eleventy-plugin/layouts'
     }
   }
 };

eleventy.config.js

@@ -90,8 +90,7 @@ export default function (eleventyConfig) {
     htmlTemplateEngine: 'njk',
     markdownTemplateEngine: 'njk',
     dir: {
-      input: 'docs',
-      layouts: '../layouts'
+      input: 'docs'
     },
     pathPrefix: process.env.GITHUB_ACTIONS && '/govuk-eleventy-plugin/'
   }

index.js

@@ -8,8 +8,9 @@ import { generateAssets } from './lib/events/generate-govuk-assets.js'
 import { md } from './lib/markdown-it.js'
 import { nunjucksConfig } from './lib/nunjucks.js'
 import { scssExtension } from './lib/extensions/scss.js'
+import { getTemplates } from './lib/utils.js'
 
-export default function (eleventyConfig, pluginOptions = {}) {
+export default async function (eleventyConfig, pluginOptions = {}) {
   const { pathPrefix } = eleventyConfig
 
   // Plugin options
@@ -23,6 +24,12 @@ export default function (eleventyConfig, pluginOptions = {}) {
   eleventyConfig.addExtension('scss', scssExtension)
   eleventyConfig.addTemplateFormats('scss')
 
+  // Virtual templates
+  const templates = await getTemplates(eleventyConfig)
+  for (const [virtualPath, template] of Object.entries(templates)) {
+    eleventyConfig.addTemplate(virtualPath, template)
+  }
+
   // Collections
   for (const [name, collection] of Object.entries(collections)) {
     eleventyConfig.addCollection(name, collection)

lib/nunjucks.js

@@ -25,6 +25,7 @@ export function nunjucksConfig(eleventyConfig) {
 
   const searchPaths = [
     './node_modules/@x-govuk/govuk-eleventy-plugin',
+    './node_modules/@x-govuk/govuk-eleventy-plugin/lib',
     './node_modules/govuk-frontend/dist',
     resolveNpmModule('@x-govuk/govuk-prototype-components'),
     ...(includes ? [path.join(input, includes)] : []),

layouts/base.njk lib/templates/base.njk

@@ -1,4 +1,4 @@
-{% extends "layouts/base.njk" %}
+{% extends "templates/base.njk" %}
 
 {% block main %}
   {{ xGovukMasthead({
@@ -47,7 +47,7 @@
 
   {% if aside or related %}
   <div class="govuk-grid-column-one-third-from-desktop">
-    {% include "layouts/shared/related.njk" %}
+    {% include "templates/shared/related.njk" %}
   </div>
   {% endif %}
 </div>

layouts/collection.njk lib/templates/collection.njk

@@ -1,4 +1,4 @@
-{% extends "layouts/base.njk" %}
+{% extends "templates/base.njk" %}
 
 {% block beforeContent %}
   {{ govukBreadcrumbs({
@@ -15,5 +15,5 @@
 
   {{ appProseScope(content) if content }}
 
-  {% include "layouts/shared/related.njk" %}
+  {% include "templates/shared/related.njk" %}
 {% endblock %}

layouts/feed.njk lib/templates/feed.njk

@@ -1,4 +1,4 @@
-{% extends "layouts/base.njk" %}
+{% extends "templates/base.njk" %}
 
 {% block beforeContent %}
   {{ govukBreadcrumbs({
@@ -37,7 +37,7 @@
 
     {% if aside or related %}
       <div class="govuk-grid-column-one-third-from-desktop">
-        {% include "layouts/shared/related.njk" %}
+        {% include "templates/shared/related.njk" %}
       </div>
     {% endif %}
   </div>

layouts/page.njk lib/templates/page.njk

@@ -1,4 +1,4 @@
-{% extends "layouts/base.njk" %}
+{% extends "templates/base.njk" %}
 
 {% block main %}
   <main id="main-content" role="main" {%- if mainLang %} lang="{{ mainLang }}"{% endif %}>
@@ -27,7 +27,7 @@
         {% block content %}
           {{ appProseScope(content) if content }}
 
-          {% include "layouts/shared/related.njk" %}
+          {% include "templates/shared/related.njk" %}
         {% endblock %}
       </div>
     </div>

layouts/post.njk lib/templates/post.njk

@@ -1,4 +1,4 @@
-{% extends "layouts/base.njk" %}
+{% extends "templates/base.njk" %}
 
 {# Create breadcrumbs manually as sitemap should be excluded from collections #}
 {% block beforeContent %}

layouts/product.njk lib/templates/product.njk

@@ -1,4 +1,4 @@
-{% extends "layouts/base.njk" %}
+{% extends "templates/base.njk" %}
 
 {% block beforeContent %}
   {{ govukBreadcrumbs({
@@ -22,7 +22,7 @@
 
       {{ appProseScope(content) if content }}
 
-      {% include "layouts/shared/related.njk" %}
+      {% include "templates/shared/related.njk" %}
     </div>
   </div>
 {% endblock %}

layouts/search-index.njk lib/templates/search-index.njk

@@ -1,4 +1,4 @@
-{% extends "layouts/base.njk" %}
+{% extends "templates/base.njk" %}
 
 {% block beforeContent %}
   {{ govukBreadcrumbs({

layouts/shared/related.njk lib/templates/shared/related.njk

@@ -1,4 +1,4 @@
-{% extends "layouts/base.njk" %}
+{% extends "templates/base.njk" %}
 
 {% block beforeContent %}
   {{ govukBreadcrumbs({

layouts/sitemap.njk lib/templates/sitemap.njk

@@ -1,6 +1,17 @@
 import path from 'node:path'
 import fs from 'node:fs/promises'
 
+/**
+ * Get file contents
+ * @param {string} filePath - Path to file
+ * @returns {string} File contents
+ */
+export async function getFileContents(filePath) {
+  filePath = path.join(import.meta.dirname, '..', filePath)
+
+  return await fs.readFile(filePath, { encoding: 'utf8' })
+}
+
 /**
  * Read contents of SCSS settings file
  * @param {object} dir - Eleventy directories
@@ -27,6 +38,37 @@ export async function getScssSettings(dir, options) {
   return settings
 }
 
+/**
+ * Get virtual templates
+ * @param {object} eleventyConfig - Eleventy config
+ * @returns {object} Template names and strings
+ */
+export async function getTemplates(eleventyConfig) {
+  const { includes, layouts } = eleventyConfig.dir
+  const layoutDir = layouts || includes
+  const layoutNames = [
+    'base',
+    'collection',
+    'feed',
+    'page',
+    'post',
+    'product',
+    'search-index',
+    'sitemap',
+    'sub-navigation',
+    'tag',
+    'tags'
+  ]
+  const templates = {}
+
+  for (const name of layoutNames) {
+    const templateString = await getFileContents(`lib/templates/${name}.njk`)
+    templates[`${layoutDir}/${name}.njk`] = templateString
+  }
+
+  return templates
+}
+
 /**
  * Normalise value provided to a filter. Checks that a given value exists
  * before performing a transformation.