{"id":15138708,"url":"https://github.com/chidiwilliams/nunjucks-templating-starter","last_synced_at":"2025-10-23T15:30:54.582Z","repository":{"id":110490873,"uuid":"138277542","full_name":"chidiwilliams/nunjucks-templating-starter","owner":"chidiwilliams","description":"Generate and compile static HTML pages using Nunjucks with asset compilation and minification","archived":false,"fork":false,"pushed_at":"2018-12-22T19:02:58.000Z","size":153,"stargazers_count":13,"open_issues_count":0,"forks_count":1,"subscribers_count":4,"default_branch":"master","last_synced_at":"2025-01-30T19:11:18.256Z","etag":null,"topics":["html-templates","nunjucks","nunjucks-starter-kit","nunjucks-templates","template"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/chidiwilliams.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2018-06-22T08:36:40.000Z","updated_at":"2023-08-21T13:24:50.000Z","dependencies_parsed_at":null,"dependency_job_id":"e86fddf0-8592-4383-a11a-43a138d477c5","html_url":"https://github.com/chidiwilliams/nunjucks-templating-starter","commit_stats":null,"previous_names":[],"tags_count":1,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chidiwilliams%2Fnunjucks-templating-starter","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chidiwilliams%2Fnunjucks-templating-starter/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chidiwilliams%2Fnunjucks-templating-starter/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chidiwilliams%2Fnunjucks-templating-starter/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/chidiwilliams","download_url":"https://codeload.github.com/chidiwilliams/nunjucks-templating-starter/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":237843926,"owners_count":19375230,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["html-templates","nunjucks","nunjucks-starter-kit","nunjucks-templates","template"],"created_at":"2024-09-26T07:43:49.357Z","updated_at":"2025-10-23T15:30:49.142Z","avatar_url":"https://github.com/chidiwilliams.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# nunjucks-templating-starter\n\n## About\n\nUse this tool to generate static HTML pages from templates and compiles CSS and JS asset files.\n\nQuickly write HTML for design screens for small projects without building a full frontend app.\n\nSupported by [Gulp](https://github.com/gulpjs/gulp) tasks and [Nunjucks](https://github.com/mozilla/nunjucks) templating engine.\n\n## Table of Contents\n\n1. [Quick Start](#quick-start)\n\n2. [Usage](#usage)\n\n3. [Available commands](#commands)\n\n4. [Configuration](#configuration)\n\n5. [Dependencies](#dependencies)\n\n\u003ca name=\"quick-start\"\u003e\u003c/a\u003e\n\n## Quick Start\n\nTo begin:\n\n1. Create new app directory\n\n2. Clone this repository\n\n```bat\ngit clone https://www.github.com/chidiwilliams/nunjucks-templating-starter\n```\n\n3. Install dependencies\n\n```bat\nnpm install\n```\n\n4. Build files and start development server\n\n```bat\nnpm run watch\n```\n\n\u003ca name=\"features\"\u003e\u003c/a\u003e\n\n## Features\n\n1. Generate HTML files quickly with only HTML, CSS and JS\n\n2. Bootstrap and jQuery included\n\n3. CSS and JavaScript minifier\n\n4. SASS compiler\n\n5. Server not required\n\n6. Works out of the box!\n\n\u003ca name=\"usage\"\u003e\u003c/a\u003e\n\n## Usage\n\n### HTML\n\nThis tool uses the Nunjucks templating engine. To learn more about Nunjucks, visit the [website](https://mozilla.github.io/nunjucks/).\n\nThe Nunjucks templates are kept in the `resources/views` directory. Both .njk and .html file extensions are supported for the templates.\n\nExample:\n\n```null\n|--views/\n  |--layouts/\n  | |--master.njk\n  |--home.njk\n```\n\nviews/layouts/master.njk\n\n```jinja\n\u003chtml\u003e\n...\n\u003cbody\u003e\n...\n{% block content %}{% endblock %}\n...\n\u003c/body\u003e\n\u003c/html\u003e\n```\n\nviews/home.njk\n\n```jinja\n{% extends 'layouts/master.njk' %}\n\n{% block content %}\n  Giraffes were invented when Chuck Norris laid an uppercut to a horse.\n{% endblock %}\n```\n\nThe rendered HTML files would be sent to the `dist` directory.\n\nhome.html\n```html\n\u003chtml\u003e\n...\n\u003cbody\u003e\n...\nGiraffes were invented when Chuck Norris laid an uppercut to a horse.\n...\n\u003c/body\u003e\n\u003c/html\u003e\n```\n\n### CSS\nPlace precompiled SCSS files in the `resources/assets/scss` directory. To minify the output CSS, set:\n\nconfig/config.js\n\n```js\nconfig.sass.outputStyle = 'compressed'\n```\n\nAfter building, the compiled CSS files are sent to the `dist/css` directory.\n\nTo import the CSS into a Nunjucks template, link to `dist/css/[FILE_NAME]`. Example:\n\nmaster.njk\n\n```jinja\n\u003chtml\u003e\n\u003chead\u003e\n  ...\n  \u003clink rel=\"stylesheet\" href=\"css/main.css\"\u003e\n\u003c/head\u003e\n\u003cbody\u003e\n...\n\u003cscript src=\"js/main.js\"\u003e\u003c/script\u003e\n\u003c/body\u003e\n...\n\u003c/html\u003e\n```\n\n### JS\n\nPlace precompiled JS files in the `resources/assets/js` directory. To minify the output JS, set:\n\nconfig/config.js\n\n```js\nconfig.sass.outputStyle = 'compressed'\n```\n\nAfter building, the compiled CSS files are sent to the `dist/css` directory.\n\n### Vendor\n\nPut vendor CSS and JS assets in the `resources/vendor/css` and `resources/vendor/js` respectively. During compilation, these assets are directly copied into the `dist` directory without processing.\n\n\u003ca name=\"commands\"\u003e\u003c/a\u003e\n\n## Available commands\n\n### `npm run build`\n\nCompiles the HTML and assets files into the dist directory. This action can also be done by running `node index.js`.\n\n### `npm run watch`\n\nSame as above but watches for file changes in the resources directory and recompiles the assets accordingly.\n\nAlso, it starts a server at http://localhost:3000/ and syncs your browser with your output files. Great for development.\n\n\u003ca name=\"configuration\"\u003e\u003c/a\u003e\n\n## Configuration\n\nThe configuration object is exported by the  `'config/config.js'` file.\n\n### `config.njk`\n\nConfiguration for the Nunjucks renderer\n\n`config.njk.templateVars`: Pass in variables here to add them as global variables in your Nunjucks templates.\n\nExample:\n\nconfig.js\n\n```js\nmodule.exports = {\n  ...\n  njk: {\n    ...\n    templateVars: {\n      quote1: \"Chuck Norris can light a fire by rubbing two ice-cubes together.\",\n      quote2: \"When Chuck Norris does a push up, he isn't lifting himself up, he's pushing the Earth down.\",\n    }\n    ...\n  }\n  ...\n}\n```\n\nhome.njk\n\n```jinja\n\u003chtml\u003e\n  ...\n  \u003cbody\u003e\n    {{ quote1 }}\n    {{ quote2 }}\n  \u003c/body\u003e\n\u003c/html\u003e\n```\n\n### `config.sass`\n\nConfiguration for the SASS renderer\n\n`config.sass.outputStyle`: Style of the output CSS files ('nested' | 'expanded' | 'compact' | 'compressed'). Default is 'nested'.\n\n### `config.js`\n\nConfiguration for the JS renderer\n\n`config.js.doCompress`: Determines if the final JS files would be compressed (true | false). Default is false.\n\n`config.js.doKeepSource`: Determines if the .js source file would be included after compression (true | false).  Default is false. `config.js.doCompress` must be set to true.\n\n\u003ca name=\"dependencies\"\u003e\u003c/a\u003e\n\n## Dependencies\n\n1. Gulp [GitHub](https://github.com/gulpjs/gulp), [NPM](https://www.npmjs.com/package/gulp), [Website](https://gulpjs.com/)\n\n2. Nunjucks [GitHub](https://github.com/mozilla/nunjucks), [Website](https://mozilla.github.io/nunjucks/)\n\n3. Nodemon [GitHub](https://github.com/remy/nodemon), [NPM](https://www.npmjs.com/package/nodemon), [Website](https://nodemon.io/)\n\n4. Browser Sync [NPM](https://www.npmjs.com/package/browser-sync), [Website](https://browsersync.io)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fchidiwilliams%2Fnunjucks-templating-starter","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fchidiwilliams%2Fnunjucks-templating-starter","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fchidiwilliams%2Fnunjucks-templating-starter/lists"}