Starting a project in Eleventy

Starting a project in Eleventy

With assistance from tutorial found at: https://www.freecodecamp.org/news/learn-eleventy/

Create a git repository with this .gitignore

node_modules
/public
.DS_Store
src/images/_image_pool/

Run npm init -y

This creates the configuration files for a node project. The -y option generates everything without the command line asking any questions (all default answers are used)

Install Eleventy using npm install --save-dev @11ty/eleventy

Create an Eleventy configuration file .eleventy.js in the root of the project. (Note - it must be a dotfile).

module.exports = function (eleventyConfig) {
  return {
    dir: {
      input: "src",
      output: "public",
    },
  };
};

Folder Structure:

/your-project
├── .eleventy.js
├── package.json
├── src/
└── public/

Create an index.md file in src with a hello world message.

Now run either:

  • npx @11ty/eleventy
  • npx @11ty/eleventy --serve

Now we have an eleventy site up and running!