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

.eleventy.js

@@ -1,27 +1,31 @@
-const rssPlugin = require('@11ty/eleventy-plugin-rss');
+import rssPlugin from '@11ty/eleventy-plugin-rss';
-const syntaxHighlight = require('@11ty/eleventy-plugin-syntaxhighlight');
+import syntaxHighlight from '@11ty/eleventy-plugin-syntaxhighlight';
-const fs = require('fs');
+import fs from 'fs';
-const util = require('util')
+import util from 'util';
 
 // Import filters
-const dateFilter = require('./src/filters/date-filter.js');
+import dateFilter from './src/filters/date-filter.js';
-const markdownFilter = require('./src/filters/markdown-filter.js');
+import markdownFilter from './src/filters/markdown-filter.js';
-const w3DateFilter = require('./src/filters/w3-date-filter.js');
+import w3DateFilter from './src/filters/w3-date-filter.js';
 
 // Import transforms
-const htmlMinTransform = require('./src/transforms/html-min-transform.js');
+import htmlMinTransform from './src/transforms/html-min-transform.js';
-const parseTransform = require('./src/transforms/parse-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
@@ -48,11 +52,9 @@ module.exports = function(config) {
   const livePosts = post => post.date <= now && !post.data.draft;
   const newsPosts = post => post.data.type === 'news';
   const eventPosts = post => post.data.type === 'event';
-  
+
   config.addCollection('posts', collection => {
-    return [
+    return [...collection.getFilteredByGlob('./src/posts/*.md')].reverse();
-      ...collection.getFilteredByGlob('./src/posts/*.md')
-    ].reverse();
   });
   config.addCollection('news', collection => {
     return [
@@ -70,56 +72,59 @@ 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()
+      .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 => {
+    collectionApi.getAll().map(item => {
-        if (item.data.tags) { // handle pages that don't have tags
+      if (item.data.tags) {
-            item.data.tags.map( tag => tagsList.add(tag))
+        // 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 => {
+    collectionApi.getFilteredByGlob('./src/members/*.md').map(item => {
-        if (item.data.tags) { // handle pages that don't have skills
+      if (item.data.tags) {
-          item.data.tags.map( skill => { // exclude non related tags
+        // handle pages that don't have skills
-            if (['post', 'news', 'event'].indexOf(skill) == -1) {
+        item.data.tags.map(skill => {
-              skillsList.add(skill)
+          // exclude non related tags
-            }
+          if (['post', 'news', 'event'].indexOf(skill) == -1) {
-          })
+            skillsList.add(skill);
-        }
+          }
+        });
+      }
     });
     return skillsList;
   });
-  config.addCollection("membersLocations", function(collectionApi) {
+  config.addCollection('membersLocations', function(collectionApi) {
-    return collectionApi.getFilteredByGlob("./src/members/*.md")
+    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()
+      .reverse()
-    .slice(0, site.maxCustomerPerPage);
+      .slice(0, site.maxCustomerPerPage);
   });
   config.addCollection('partners', collection => {
-    return [...collection.getFilteredByGlob("./src/partners/*.md")]
+    return [...collection.getFilteredByGlob('./src/partners/*.md')]
-    .reverse()
+      .reverse()
-    .slice(0, site.maxPartnerPerPage);
+      .slice(0, site.maxPartnerPerPage);
   });
 
   // Plugins
@@ -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/styleguide.js

@@ -1,4 +1,9 @@
-import tokens from './tokens.json' with { type: "json" };
+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');
 
 export default {
   colors() {

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) {
+export default function markdown(value) {
-  return markdownIt.render(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/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');
+import {JSDOM} from '@tbranyen/jsdom';
-const {JSDOM} = jsdom;
+import minify from '../utils/minify.js';
-const minify = require('../utils/minify.js');
+import slugify from 'slugify';
-const slugify = require('slugify');
+import getSize from 'image-size';
-const getSize = require('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')
     ];
@@ -22,12 +25,12 @@ module.exports = function(value, outputPath) {
         image.setAttribute('loading', 'lazy');
 
         const file = image.getAttribute('src');
-        
+
         if (file.indexOf('http') < 0) {
           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
@@ -44,7 +47,7 @@ module.exports = function(value, outputPath) {
           figCaption.innerHTML = image.getAttribute('title');
           figure.appendChild(figCaption);
         }
-        
+
         image.parentNode.replaceWith(figure);
       });
     }
@@ -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, '"');
-};
+}