Existe-t-il un outil qui convertit css en less.css?

J'ai un assez gros fichier CSS, que je veux convertir en moins. Quand j'ai écrit le CSS, je ne connaissais pas less.css, mais maintenant je veux toujours utiliser mon ancien CSS.

Existe-t-il un outil qui peut m'aider à le convertir automatiquement?

J'ai en fait trouvé quelque chose maintenant: http://leafo.net/lessphp/lessify/

Il fait un formatage de base, par exemple:

#header {
/* ... */
}

#header p {
/* ... */
}

à

#header {
/* ... */
p {
/* ... */
}
}

En fait, vous n'avez besoin d'aucun outil de conversion pour commencer à travailler avec LESS. La syntaxe LESS est rétrocompatible avec CSS . Cela signifie que tout fichier CSS est également un fichier MOINS valide.

Obtenez simplement votre CSS et renommez-le en fichier MOINS. Utilisez ensuite des fonctionnalités spécifiques à LESS avec vos modifications. Plus vous mettrez à jour le fichier, plus vous pourrez utiliser MOINS de fonctionnalités.

J'ai fait de même pour SCSS et un très gros projet avec 10 fichiers CSS. Il était presque impossible (et une énorme perte de temps) de réécrire tous les CSS avec SCSS. Je l'ai simplement renommé, puis à chaque fois que je travaillais sur le fichier CSS, j'exécutais un petit refactoring sur le code pour profiter des mixins, des variables et ainsi de suite.

Avez-vous regardé le moins? C'est beaucoup mieux pour convertir CSS que Lessify. En particulier, Lessify n'optimise pas très bien vos classes. Il a copié le navigateur réinitialise tous ses mixins générés, créant des attributs redondants. Il est clair que c'est encore au stade expérimental. Aucun des utilitaires ne peut déterminer la sémantique, ils ne peuvent donc pas convertir les valeurs en expressions, vars ou mixins paramétriques.

Le moins fait un meilleur travail d'optimisation et semble être plus fonctionnel. Il gère même les pseudoclasses pour vous:

http://toki-woki.net/p/least/

Ces outils sont idéaux pour travailler avec de gros fichiers CSS préexistants. Voici les étapes que je recommande pour convertir CSS en MOINS (assurez-vous de conserver une copie des fichiers CSS d'origine):

1. Si vous travaillez avec plusieurs fichiers CSS additifs, fusionnez-les en un seul fichier CSS. Cela garantit que tout est LESSied et optimisé ensemble.

2. Exécutez le code CSS résultant via un utilitaire de nettoyage CSS en ligne. J'ai eu de bons résultats avec cleancss: http://www.cleancss.com/ . Cela supprimera tout balisage superflu et redondant qui pourrait ne pas être détecté par un convertisseur MOINS.

3. Supprimez @Media et tous les réinitialisations de style que vous avez dans le fichier CSS. Ils peuvent créer des problèmes ou introduire des redondances possibles. C'est probablement une bonne idée de conserver les réinitialisations dans un fichier séparé.

4. Collez le fichier CSS résultant dans Least et observez la bête.

5. Réintroduisez vos réinitialisations et @screen.

6. Maintenant que vous avez terminé, parcourez chacun des attributs et trouvez de bons candidats pour la refactorisation et transformez-les en MOINS variables et expressions. Les attributs de couleur et de police CSS sont les plus faciles à prendre en compte, la recherche globale simple et le remplacement fonctionnent correctement. À la fin, vous pouvez décider si vous souhaitez diviser le fichier unique en fichiers logiques plus petits. Vous pouvez constater que le processus vous oblige à réorganiser vos fichiers d'une manière différente.

Je ne suis pas l'auteur de Least, juste quelqu'un qui cherche un outil similaire et a décidé d'en parler au monde.

Je ne pense pas qu'il existe un moyen pour un convertisseur de savoir ce que vous voulez faire avec une grande partie du code.

Par exemple, il ne saurait pas nécessairement quelles variables vous souhaitez utiliser. Ou comment générer des mixins ou des fonctions.

Je pense qu'avec celui-ci, vous devrez le faire manuellement.

Que diriez-vous de rechercher et de remplacer.

si vous l'avez color:#ffffffet que vous souhaitez le changer en@color

il suffit de rechercher color:#ffffffou de color : #ffffffremplacer par @color.

Je ne fais généralement pas confiance à ces outils.

ou vous pouvez écrire un script PHP très simple qui le gère.

Mise à jour 1 :
Ou vous pouvez utiliser le http://nex-3.com/posts/96-scss-sass-is-a-css-extension qui est similaire à less et il a un outil de conversion.

Essayez ce site: css2less.cc

Il convertit votre CSS en MOINS pendant que vous tapez.