6
votes

ERREUR dans la construction du module a échoué (à partir de ./node_modules/sass-loader/lib/loader.js):

J'exécute la commande suivante:

ng build --prod --aot --base-href ./

Et recevoir;

        "styles": [
          "node_modules/@clr/icons/clr-icons.min.css",
          "node_modules/@clr/ui/clr-ui.min.css",
          "node_modules/prismjs/themes/prism-solarizedlight.css",
          "src/styles.css",
          "node_modules/lato-font/css/lato-font.min.css"
        ],
        "scripts": [
          "node_modules/core-js/client/shim.min.js",
          "node_modules/mutationobserver-shim/dist/mutationobserver.min.js",
          "node_modules/@webcomponents/custom-elements/custom-elements.min.js",
          "node_modules/web-animations-js/web-animations.min.js",
          "node_modules/prismjs/prism.js",
          "node_modules/prismjs/components/prism-typescript.min.js",
          "node_modules/@clr/icons/clr-icons.min.js"
        ]

Je suis sur Angular 7 et Clarity 1.04.

Extrait de mon angular.json:

ERROR in Module build failed (from ./node_modules/sass-loader/lib/loader.js):

$clr-popover-box-shadow-color: rgba(clr-getColor(dark), 0.25);
                              ^
      Argument `$color` of `rgba($color, $alpha)` must be a color
      in /Users/allan/git/dcfrontend/node_modules/@clr/ui/src/utils/_variables.global.scss (line 84, column 32)

angular sass-loader vmware-clarity

4 commentaires

montrez-nous s'il vous plaît le _variables.global.scss thx

github.com/vmware/clarity/ blob / master / src / clr-angular / utils / ‌…

que renvoie clr-getColor (dark) ? Cela ne peut pas être une couleur valide car sinon vous n'obtiendrez pas ces erreurs, est-ce qu'un format incorrect?

Comment tester cela? cela se produit pendant la construction.

7 Réponses :

0
votes

J'ai donc obtenu ma réponse en exécutant ng serve au lieu de ng build - cela m'a indiqué lequel de mes propres fichiers source contenait réellement le problème.

J'ai résolu en remplaçant les importations suivantes:

$clr-header-height: 2.5rem;
$clr-near-white: #fafafa;
$clr-dark-gray: #565656;
$clr-light-gray: #eee;

par des valeurs codées en dur:

@import '../../../../node_modules/@clr/ui/src/utils/helpers.clarity';
@import '../../../../node_modules/@clr/ui/src/color/utils/colors.clarity';
@import '../../../../node_modules/@clr/ui/src/color/utils/contrast-cache.clarity';
@import '../../../../node_modules/@clr/ui/src/color/utils/helpers.clarity';
@import '../../../../node_modules/@clr/ui/src/utils/variables.clarity';

3 commentaires

Créez-vous un thème personnalisé pour votre application Clarity?

Je vois. Si vous finissez par remplacer un grand nombre de variables, il peut être plus facile de le faire de la même manière qu'un thème personnalisé peut être construit. N'hésitez pas à me cingler si vous avez des questions ou des problèmes.

Merci! La motivation ici est purement d'obtenir une construction réussie après une mise à jour angulaire. Voici mon prochain problème: stackoverflow.com/questions/54356517/...

13
votes

J'obtenais également la même erreur et je l'ai résolue en exécutant la commande npm ci-dessous:

npm rebuild node-sass

0 commentaires

2
votes

Cela résout mon problème npm install --save-dev --unsafe-perm node-sass

0 commentaires

6
votes

npm install node-sass
Worked for me :) Just try this if "npm rebuild node-sass" not worked

0 commentaires

1
votes

vérifiez la version prise en charge. À la date, j'ai installé le nœud 12.x sur ma machine et j'ai passé une heure à exécuter npm install node-sass et npm rebuild node-sass avec --force et --save-dev conseils.

Rien n'a fonctionné tant que je n'ai pas désinstallé le nœud 12.x et installé le nœud 10.x. Donc, si vous rencontrez le même problème et que vous ne parvenez pas à le faire fonctionner, essayez de suivre

Vérifiez si la version de votre nœud (exécutez le nœud -v) est supérieure à 10.x
Désinstaller le Node 12.x de votre machine
Téléchargez et installez Node 10.x
Redémarrez la console / l'éditeur (non requis pour tous et peut fonctionner sans cette étape)

0 commentaires

0
votes

Utilisez NVM pour rétrograder la version de votre nœud - 99% de ces erreurs proviennent d'un conflit de version entre les versions de nœud prises en charge par node-sass et ce que vous exécutez sur votre système. C'est toujours frustrant!

0 commentaires

0
votes

Dans mon cas, je n'utilisais pas (ng serve) depuis le dossier racine de mon projet. Le déplacement vers le dossier racine a résolu le problème pour moi.

0 commentaires