Le nouveau gars ici. Je cherche une bonne solution à utiliser Stylus (CSS compilé CSS) côté client.
Maintenant, je connais les conseils concernant ne pas utiliser le côté client CSS compilé car:
Cependant, mon environnement est une extension faite pour chrome et opéra. Cela fonctionne dans un environnement JS et cela fonctionne hors ligne, donc ni 1, 2 ou 3 s'applique. Ce que je cherche vraiment ici n'est qu'un moyen d'écrire du CSS plus efficacement avec moins de maux de tête, de plus de variables, de nidification et de mélanges.
J'ai essayé moins, ce qui est le seul de Trio moins, Sass et Stylus qui fonctionne actuellement du côté du client. Donc, quelqu'un connaît-il une bonne solution pour Stylus?
4 Réponses :
Je ne comprends pas totalement votre question, mais je vais offrir une partie de l'expérience que j'ai avec CSS compilée en utilisant moins.
Des implémentations antérieures nécessaires à JavaScript pour compiler les fichiers moins en CSS dans le navigateur, je n'ai jamais essayé de travailler de cette façon ne me semblait pas très gentil avec moi et comme vous le dites si JS est éteint votre temps difficile. .
J'utilise des applications récemment pour compiler moins de code dans CSS valide, cela se rapproche de la nécessité pour JS de convertir le code source.
La première application que j'ai utilisée était crunch http://crunchapp.net/ qui a bien fonctionné mais n'a pas été compiler le CSS à la volée.
L'application que j'utilise désormais est appelée Simpless http://weeeekiss.com/simpless et ceci crée CSS valide à la volée SOIT Dès que j'ai appuyé sur Saublime texte et rafraîchir dans le navigateur, je peux voir mes modifications à la CSS.
Utilisation de ce flux de travail, je suis capable de contourner les problèmes que vous avez soulevés ci-dessus, lorsque j'ai fini de faire du développement, je viens de télécharger mon fichier CSS sorti de la simplification qui est également fortement minifiée, qui permet également de gagner du temps en termes de besoin optimiser le CSS plus loin.
J'espère avoir compris la question correctement, sinon excuses.
acclamations, Stefan
Extensions (type de) nécessite JS, donc je suis certain qu'il est allumé. La simplicité semble intéressante et sublime aussi pour cette affaire. Je vais essayer cette solution d'essai.
Les préprocesseurs CSS ne sont pas réellement destinés à être exécutés côté client. Certains outils (c'est-à-dire moins) offrent un compilateur de la clientèle du temps de développement (JavaScript) qui compilera à la volée; Cependant, cela n'est pas destiné à la production.
Le fait que Stylus / Sass ne fournisse pas cela par défaut est en réalité une bonne chose et je souhaite personnellement que moins pas; Cependant, dans le même temps, je me rends compte que l'avoir opença la porte des personnes qui préfèrent avoir des roues de formation qui peuvent les aider au début. Tout le monde apprend de manière différente, ce qui peut être juste la fonctionnalité qui puisse obtenir un certain nombre de groupes de personnes à la porte. Donc, pour le développement, tout ira bien, mais au moment de cette rédaction, ce flux de travail n'est pas la chose la plus performante à faire en production. Espérons que, à un moment donné, la plupart des fonctionnalités utiles de ces outils seront ajoutées au CSS natif, alors ce sera un point de théâtre.
À l'heure actuelle, mes conseils seraient de ne pas déployer la CSS compilée et utilisez quelque chose comme Watch ou Guard ou Codekit (ou tout Observateur de fichiers équivalent approprié ) dans le développement afin que vos fichiers de stylet soient rééquipés comme vous le code.
Je suis heureux tant que je peux écrire un stylet dans Dev, puis déployer CSS aux navigateurs des clients. Merci! Je vais essayer de regarder.
Je recommanderais également cette version de montre ( github.com/visionMedia/wwatch#about ). J'ai lié à la section A propos de la README qui répertorie les améliorations sur l'original.
Je sais que c'est une sorte d'un vieux sujet / fil, mais je suis curieux de savoir pourquoi vous pensez que cela ne devrait pas être compilé à la volée. J'utilise des processus de construction avec des préprocesseurs tels que GRUNT pendant des années, construisant les processus de construction / de déploiement de Behemoth et franchement, j'en ai un peu fatigué. Je souhaite que les navigateurs modernes appuient déjà ces syntaxes alternatives ...
@mmmmeff j'espère que ma dernière modification répond à votre question.
compilé moins / CSS à la volée dans les navigateurs en mode de développement est une technique totalement valide. Encore plus, des choses comme un échange de module à chaud.
Cette page a probablement la solution: http://learnboost.github.io/stylus/try .html
Il semble s'agir de la compilation de stylet à la volée.
Cela l'a. Stylus (Str) .Rendeur (fonction (ERR, CSSSTR) {...}); Ensuite, ajoutez simplement l'élément de style CSS à l'intérieur.
Quel est le livre lib pour faire ça?
Ils incluent une version minifiée de Stylus: Stylus-lang.com/try/styLus.min .js . Si vous mettez ce script sur n'importe quelle page, vous aurez accès au STYLUS (SRC) .Render () fonctionnalité
stylet est capable d'exécuter dans le navigateur
Il y a une branche disponible dans le Github Repo