From 54ab6b7e7347abdd77fa07576b577ab7f1301a99 Mon Sep 17 00:00:00 2001 From: Florian Michaut Date: Fri, 22 Nov 2024 16:58:33 +0100 Subject: [PATCH] fix(esm): only use esm + temp fix for importing json files --- .eleventy.js | 99 +++++++++++++++------------- package.json | 1 + src/_data/styleguide.js | 7 +- src/filters/date-filter.js | 23 +++++-- src/filters/markdown-filter.js | 10 +-- src/filters/w3-date-filter.js | 4 +- src/transforms/html-min-transform.js | 6 +- src/transforms/parse-transform.js | 27 ++++---- src/utils/minify.js | 4 +- 9 files changed, 106 insertions(+), 75 deletions(-) diff --git a/.eleventy.js b/.eleventy.js index 95ccb7f..5f136f8 100644 --- a/.eleventy.js +++ b/.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 @@ -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 [ - ...collection.getFilteredByGlob('./src/posts/*.md') - ].reverse(); + return [...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")] - .reverse() - .slice(0, site.maxProfilePreview) - ; + return [...collection.getFilteredByGlob('./src/members/*.md')] + .reverse() + .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 - if (['post', 'news', 'event'].indexOf(skill) == -1) { - skillsList.add(skill) - } - }) - } + 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); + } + }); + } }); 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")] - .reverse() - .slice(0, site.maxCustomerPerPage); + return [...collection.getFilteredByGlob('./src/customers/*.md')] + .reverse() + .slice(0, site.maxCustomerPerPage); }); config.addCollection('partners', collection => { - return [...collection.getFilteredByGlob("./src/partners/*.md")] - .reverse() - .slice(0, site.maxPartnerPerPage); + return [...collection.getFilteredByGlob('./src/partners/*.md')] + .reverse() + .slice(0, site.maxPartnerPerPage); }); // Plugins @@ -146,6 +151,6 @@ module.exports = function(config) { input: 'src', output: 'dist' }, - passthroughFileCopy: true, + passthroughFileCopy: true }; -}; +} diff --git a/package.json b/package.json index 75bbcd1..6259c7d 100755 --- a/package.json +++ b/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", diff --git a/src/_data/styleguide.js b/src/_data/styleguide.js index 2a5e996..baa36b3 100644 --- a/src/_data/styleguide.js +++ b/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() { diff --git a/src/filters/date-filter.js b/src/filters/date-filter.js index fa06928..e36574e 100644 --- a/src/filters/date-filter.js +++ b/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()}`; +} diff --git a/src/filters/markdown-filter.js b/src/filters/markdown-filter.js index 530c2f5..a1fabb4 100644 --- a/src/filters/markdown-filter.js +++ b/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); +} diff --git a/src/filters/w3-date-filter.js b/src/filters/w3-date-filter.js index d31538d..a1da017 100644 --- a/src/filters/w3-date-filter.js +++ b/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(); -}; +} diff --git a/src/transforms/html-min-transform.js b/src/transforms/html-min-transform.js index 7d0c8f9..c91625e 100644 --- a/src/transforms/html-min-transform.js +++ b/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; -}; +} diff --git a/src/transforms/parse-transform.js b/src/transforms/parse-transform.js index befbb08..f301859 100644 --- a/src/transforms/parse-transform.js +++ b/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') ]; @@ -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 '\r\n' + document.documentElement.outerHTML; } return value; -}; +} diff --git a/src/utils/minify.js b/src/utils/minify.js index dd80e24..74130bd 100644 --- a/src/utils/minify.js +++ b/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, '"'); -}; +}