fix(esm): only use esm + temp fix for importing json files

.eleventy.js

@@ -1,27 +1,31 @@
-const rssPlugin = require('@11ty/eleventy-plugin-rss');
-const syntaxHighlight = require('@11ty/eleventy-plugin-syntaxhighlight');
-const fs = require('fs');
-const util = require('util')
+import rssPlugin from '@11ty/eleventy-plugin-rss';
+import syntaxHighlight from '@11ty/eleventy-plugin-syntaxhighlight';
+import fs from 'fs';
+import util from 'util';
 
 // Import filters
-const dateFilter = require('./src/filters/date-filter.js');
-const markdownFilter = require('./src/filters/markdown-filter.js');
-const w3DateFilter = require('./src/filters/w3-date-filter.js');
+import dateFilter from './src/filters/date-filter.js';
+import markdownFilter from './src/filters/markdown-filter.js';
+import w3DateFilter from './src/filters/w3-date-filter.js';
 
 // Import transforms
-const htmlMinTransform = require('./src/transforms/html-min-transform.js');
-const parseTransform = require('./src/transforms/parse-transform.js');
+import htmlMinTransform from './src/transforms/html-min-transform.js';
+import parseTransform from './src/transforms/parse-transform.js';
 
 // Import data files
+import {createRequire} from 'node:module';
+const require = createRequire(import.meta.url);
+// need this because of issue when using ESM : https://github.com/11ty/eleventy-dependency-tree-esm/issues/2
+// This will get soon resolved
 const site = require('./src/_data/site.json');
 
-module.exports = function(config) {
+export default function(config) {
   // Filters
   config.addFilter('dateFilter', dateFilter);
   config.addFilter('markdownFilter', markdownFilter);
   config.addFilter('w3DateFilter', w3DateFilter);
   config.addFilter('dump', obj => {
-    return util.inspect(obj)
+    return util.inspect(obj);
   });
 
   // Layout aliases
@@ -50,9 +54,7 @@ module.exports = function(config) {
   const eventPosts = post => post.data.type === 'event';
 
   config.addCollection('posts', collection => {
-    return [
-      ...collection.getFilteredByGlob('./src/posts/*.md')
-    ].reverse();
+    return [...collection.getFilteredByGlob('./src/posts/*.md')].reverse();
   });
   config.addCollection('news', collection => {
     return [
@@ -70,54 +72,57 @@ module.exports = function(config) {
       .slice(0, site.maxNewsPerPage);
   });
   config.addCollection('members', collection => {
-    return [...collection.getFilteredByGlob("./src/members/*.md")];
+    return [...collection.getFilteredByGlob('./src/members/*.md')];
   });
   config.addCollection('profiles', collection => {
-    return [...collection.getFilteredByGlob("./src/members/*.md")]
+    return [...collection.getFilteredByGlob('./src/members/*.md')]
       .reverse()
-    .slice(0, site.maxProfilePreview)
-    ;
+      .slice(0, site.maxProfilePreview);
   });
-  config.addCollection("tagsList", function(collectionApi) {
+  config.addCollection('tagsList', function(collectionApi) {
     const tagsList = new Set();
-    collectionApi.getAll().map( item => {
-        if (item.data.tags) { // handle pages that don't have tags
-            item.data.tags.map( tag => tagsList.add(tag))
+    collectionApi.getAll().map(item => {
+      if (item.data.tags) {
+        // handle pages that don't have tags
+        item.data.tags.map(tag => tagsList.add(tag));
       }
     });
     return tagsList;
   });
-  config.addCollection("skillsList", function(collectionApi) {
+  config.addCollection('skillsList', function(collectionApi) {
     const skillsList = new Set();
-    collectionApi.getFilteredByGlob("./src/members/*.md").map( item => {
-        if (item.data.tags) { // handle pages that don't have skills
-          item.data.tags.map( skill => { // exclude non related tags
+    collectionApi.getFilteredByGlob('./src/members/*.md').map(item => {
+      if (item.data.tags) {
+        // handle pages that don't have skills
+        item.data.tags.map(skill => {
+          // exclude non related tags
           if (['post', 'news', 'event'].indexOf(skill) == -1) {
-              skillsList.add(skill)
+            skillsList.add(skill);
           }
-          })
+        });
       }
     });
     return skillsList;
   });
-  config.addCollection("membersLocations", function(collectionApi) {
-    return collectionApi.getFilteredByGlob("./src/members/*.md")
+  config.addCollection('membersLocations', function(collectionApi) {
+    return collectionApi
+      .getFilteredByGlob('./src/members/*.md')
       .filter(item => typeof item.data.location !== 'undefined')
-      .map( member => {
+      .map(member => {
         return {
           name: member.data.name,
           url: member.data.url,
-          location: member.data.location,
+          location: member.data.location
         };
       });
   });
   config.addCollection('customers', collection => {
-    return [...collection.getFilteredByGlob("./src/customers/*.md")]
+    return [...collection.getFilteredByGlob('./src/customers/*.md')]
       .reverse()
       .slice(0, site.maxCustomerPerPage);
   });
   config.addCollection('partners', collection => {
-    return [...collection.getFilteredByGlob("./src/partners/*.md")]
+    return [...collection.getFilteredByGlob('./src/partners/*.md')]
       .reverse()
       .slice(0, site.maxPartnerPerPage);
   });
@@ -146,6 +151,6 @@ module.exports = function(config) {
       input: 'src',
       output: 'dist'
     },
-    passthroughFileCopy: true,
+    passthroughFileCopy: true
   };
-};
+}

package.json

@@ -3,6 +3,7 @@
   "version": "0.1.0",
   "description": "Site web de la coopérative Astrolabe CAE",
   "main": "index.js",
+  "type": "module",
   "dependencies": {
     "@11ty/eleventy": "^3.0.0",
     "@11ty/eleventy-plugin-rss": "^2.0.2",

src/_data/global.js

@@ -1,4 +1,4 @@
-module.exports = {
+export default {
   random() {
     const segment = () => {
       return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);

src/_data/helpers.js

@@ -1,4 +1,4 @@
-module.exports = {
+export default {
   getNextHeadingLevel(currentLevel) {
     return parseInt(currentLevel, 10) + 1;
   },

src/_data/styleguide.js

@@ -1,6 +1,11 @@
+import {createRequire} from 'node:module';
+const require = createRequire(import.meta.url);
+// need this because of issue when using ESM : https://github.com/11ty/eleventy-dependency-tree-esm/issues/2
+// This will get soon resolved
+
 const tokens = require('./tokens.json');
 
-module.exports = {
+export default {
   colors() {
     let response = [];
 

src/_includes/partials/global/meta-info.njk

@@ -7,8 +7,8 @@
   {% set pageTitle = metaTitle %}
 {% endif %}
 
-{% if metaDesc %}
-  {% set pageDesc = metaDesc %}
+{% if description %}
+  {% set pageDesc = description %}
 {% endif %}
 
 <title>{{ pageTitle }}</title>
@@ -24,10 +24,10 @@
   <meta name="twitter:creator" content="@{{ site.authorHandle | replace('@', '') }}" />
 {% endif %}
 
-{% if metaDesc %}
-  <meta name="description" content="{{ metaDesc }}" />
-  <meta name="twitter:description" content="{{ metaDesc }}" />
-  <meta property="og:description" content="{{ metaDesc }}" />
+{% if description %}
+  <meta name="description" content="{{ description }}" />
+  <meta name="twitter:description" content="{{ description }}" />
+  <meta property="og:description" content="{{ description }}" />
 {% endif %}
 
 {% if socialImage %}  

src/feed.njk

@@ -19,7 +19,7 @@
     <atom:link href="{{ permalink | htmlBaseUrl(metadata.base) }}" rel="self" type="application/rss+xml" />
     <description>{{ metadata.description }}</description>
     <language>{{ metadata.language or page.lang }}</language>
-    {%- for post in collections.news %}
+    {%- for post in collections.posts %}
     {%- set absolutePostUrl = post.url | htmlBaseUrl(metadata.base) %}
     <item>
       <title>{{ post.data.title }}</title>

src/filters/date-filter.js

@@ -5,13 +5,28 @@ const appendSuffix = n => {
   return n + (s[(v - 20) % 10] || s[v] || s[0]);
 };
 
-module.exports = function dateFilter(value) {
+export default function dateFilter(value) {
   const dateObject = new Date(value);
 
   // const months = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
-  const months = ['janv.', 'févr.', 'mars', 'avr.', 'mai', 'juin', 'juill.', 'août', 'sept.', 'oct.', 'nov.', 'déc.'];
+  const months = [
+    'janv.',
+    'févr.',
+    'mars',
+    'avr.',
+    'mai',
+    'juin',
+    'juill.',
+    'août',
+    'sept.',
+    'oct.',
+    'nov.',
+    'déc.'
+  ];
   const dayWithSuffix = appendSuffix(dateObject.getDate());
 
   // return `${dayWithSuffix} ${months[dateObject.getMonth()]} ${dateObject.getFullYear()}`;
-  return `${dateObject.getDate()} ${months[dateObject.getMonth()]} ${dateObject.getFullYear()}`;
-};
+  return `${dateObject.getDate()} ${
+    months[dateObject.getMonth()]
+  } ${dateObject.getFullYear()}`;
+}

src/filters/markdown-filter.js

@@ -1,9 +1,11 @@
-const markdownIt = require('markdown-it')({
+import markdownIt from 'markdown-it';
+
+const m = markdownIt({
   html: true,
   breaks: true,
   linkify: true
 });
 
-module.exports = function markdown(value) {
-  return markdownIt.render(value);
-};
+export default function markdown(value) {
+  return m.render(value);
+}

src/filters/w3-date-filter.js

@@ -1,5 +1,5 @@
-module.exports = function w3cDate(value) {
+export default function w3cDate(value) {
   const dateObject = new Date(value);
 
   return dateObject.toISOString();
-};
+}

src/index.md

@@ -5,5 +5,5 @@ brandHeading: La Coopérative d'Entrepreneur·es spécialisée dans le numériqu
 newsHeading: Actualité & Évenements
 customersHeading: Ils nous font confiance
 partnersHeading: Nos partenaires
-metaDesc: 'Astrolabe CAE est une coopérative d Entrepreneur·es (scop) spécialisée dans l accompagnement au développement de projets autour des métiers du numérique. L entrepreneuriat (entrepreneur, entrepreneure, entrepreneuse, indépendant, indépendante, freelance, createur, créatrice) sans prise de tête, vous développez votre projet, vous gérez vos clients et nous faisons le reste et le tout dans un cadre coopératif (SCOP, ESS).'
+description: 'Astrolabe CAE est une coopérative d Entrepreneur·es (scop) spécialisée dans l accompagnement au développement de projets autour des métiers du numérique. L entrepreneuriat (entrepreneur, entrepreneure, entrepreneuse, indépendant, indépendante, freelance, createur, créatrice) sans prise de tête, vous développez votre projet, vous gérez vos clients et nous faisons le reste et le tout dans un cadre coopératif (SCOP, ESS).'
 ---

src/transforms/html-min-transform.js

@@ -1,6 +1,6 @@
-const htmlmin = require('html-minifier');
+import htmlmin from 'html-minifier';
 
-module.exports = function htmlMinTransform(value, outputPath) {
+export default function htmlMinTransform(value, outputPath) {
   if (outputPath.indexOf('.html') > -1) {
     let minified = htmlmin.minify(value, {
       useShortDoctype: true,
@@ -11,4 +11,4 @@ module.exports = function htmlMinTransform(value, outputPath) {
     return minified;
   }
   return value;
-};
+}

src/transforms/parse-transform.js

@@ -1,17 +1,20 @@
-const jsdom = require('@tbranyen/jsdom');
-const {JSDOM} = jsdom;
-const minify = require('../utils/minify.js');
-const slugify = require('slugify');
-const getSize = require('image-size');
+import {JSDOM} from '@tbranyen/jsdom';
+import minify from '../utils/minify.js';
+import slugify from 'slugify';
+import getSize from 'image-size';
 
-module.exports = function(value, outputPath) {
+export default function(value, outputPath) {
   if (outputPath.endsWith('.html')) {
     const DOM = new JSDOM(value, {
       resources: 'usable'
     });
 
     const document = DOM.window.document;
-    const articleImages = [...document.querySelectorAll('main section:not(.process-cae, .presentation, .member) article img, .intro img')];
+    const articleImages = [
+      ...document.querySelectorAll(
+        'main section:not(.process-cae, .presentation, .member) article img, .intro img'
+      )
+    ];
     const articleHeadings = [
       ...document.querySelectorAll('main article h2, main article h3')
     ];
@@ -27,7 +30,7 @@ module.exports = function(value, outputPath) {
           const dimensions = getSize('src' + file);
 
           image.setAttribute('width', dimensions.width);
-          image.setAttribute('height', dimensions.height);;
+          image.setAttribute('height', dimensions.height);
         }
 
         // Replace p tags by figure tag for img
@@ -86,4 +89,4 @@ module.exports = function(value, outputPath) {
     return '<!DOCTYPE html>\r\n' + document.documentElement.outerHTML;
   }
   return value;
-};
+}

src/utils/minify.js

@@ -1,3 +1,3 @@
-module.exports = function minify(input) {
+export default function minify(input) {
   return input.replace(/\s{2,}/g, '').replace(/\'/g, '"');
-};
+}