search

GouvernementFR / dsfr

🇫🇷 Official french government's design system (Système de Design de l'État)
https://www.systeme-de-design.gouv.fr/
Other
243 stars 54 forks source link

Mise à jour de l'import des icones ( v.1.5.1) #309

Closed JavaVivi closed 2 years ago

JavaVivi commented 2 years ago

En utilisant la documentation:

import '../../../node_modules/@gouvfr/dsfr/dist/utility/utility.css';

dans un fichier importer.js compilé avec webpack et npm

j'obtiens les erreurs suivantes :

WAIT Compiling...13:07:01

ERROR Failed to compile with 2 errors13:07:06

error in ./node_modules/@gouvfr/dsfr/dist/utility/utility.css13:07:06

Module parse failed: Maximum call stack size exceeded File was processed with these loaders:

  • ./node_modules/css-loader/dist/cjs.js
  • ./node_modules/postcss-loader/dist/cjs.js You may need an additional loader to handle the result of these loaders. RangeError: Maximum call stack size exceeded
jchourdeaux commented 2 years ago

Bonjour @JavaVivi , merci pour le retour, nous allons regarder cela.

comxd commented 2 years ago

Bonjour @jchourdeaux , Y'a t'il des bugs connus sur la v1.5.1 concernant Webpack ?

wiwski commented 2 years ago

Même erreur chez nous

jchourdeaux commented 2 years ago

Bonjour @JavaVivi , @comxd , @wiwski Après recherches, il semblerait que ce soit lié à un problème d’UglifyJs avec les fichiers trop importants. (https://github.com/mishoo/UglifyJS/issues/414).

La seule solution de contournement que nous voyons actuellement est d'utiliser les sous-fichiers css se trouvant dans le répertoire utility/icons (/icons-xxxx).

donc par exemple import '../../../node_modules/@gouvfr/dsfr/dist/utility/icons/icons-buildings/icons-buildings.css'; import '../../../node_modules/@gouvfr/dsfr/dist/utility/icons/icons-buildings/icons-development.css'; etc.

En espérant que cela puisse vous aider

wiwski commented 2 years ago

Bonjour @jchourdeaux, Merci pour la solution, ça fonctionne en ajoutant les sous-fichiers :+1: