Diviser les fichiers less

scomete
Les bases HTML/CSS

Bonjour,

Je suis en train de débuter avec le less. Je souhaite diviser mon code de la maniere suivante

<head> <link rel="stylesheet" type="text/css" href="../../lib/css/style.css"> <!-- pour les resets et fonts --> <link rel="stylesheet/less" type="text/css" href="../../lib/css/global.less"/> <!-- pour afficher toutes mes variables --> <link rel="stylesheet/less" type="text/css" href="login.less"/> <!-- Tout mon style pour la zone de login --> <script src="../../lib/js/less.min.js" type="text/javascript"></script> <!-- complile les .less --> </head>

Hors lorsque je souhaite afficher mon fichier je n'ai pas le style contenu dans login.less.
Voici mon message d'erreur :
b.exports {type: "Name", filename: "/app/login/login.less", index: 194, line: 12, callLine: NaN…}callExtract: undefinedcallLine: NaNcolumn: 14extract: Array(3)filename: "/app/login/login.less"href: "/app/login/login.less"index: 194line: 12message: "variable @white is undefined"stack: undefinedtype: "Name"proto: Error
d @ less.min.js:13

Alors que si je met tout dans un seul fichier .less je récupere bien tout mon style.

Comment faire ?

Merci par avance pour votre aide.

6 réponses

Benjamin Derepas

Tu ne peux pas importer dans ton fichier HTML un fichier less ... tu dois le compiler en CSS avant.

scomete
Auteur

Si si avec la librairie js ça l'interprete directement quand j'ai qu'un seul fichier ça marche nickel

Defy

c'est pas du tous une bonne chose, parceque si un navigateur a desactivé le js, ton site ne fonctionne pas, il ne faut jamais passé par des truc comme ca, en plus d'etre dangeureux pour l'accessibilité du site, c'est contre productif pour la mise en production, le js vas devoir parser le .less a chaque fois, si tu as une code base foiré dans tes fichier .less ca va sacrément ralentir les perfs de ton site.

bref, c'est pas du tous productif, un pipeline gulp pour la compile est carrément plus performant.

Asmista

Je suis d'accord avec Defy, même si tu as trouvé un cas qui marche je ne te recommande pas de faire ça. Tu finiras par avoir un soucis sur ton site.

scomete
Auteur

D'accord je vais voir pour le faire de la bonne façon par contre comment fait'on pour l'installer directement coté serveur?

Defy

en faite c'est pas comme ca que cela fonctionne, c'est un pipeline coté client avec gulp ou grunt ou encore webpack qui vas te permetre de builder tes .less en .css