Comment enregistrer / exporter les modifications apportées dans Firebug?


10

En utilisant Firebug pour modifier le CSS, comment enregistrer / exporter les modifications apportées au CSS?

OUTILS: Firefox , Firebug


MISE À JOUR MAJEURE: Si vous connaissez un moyen de verrouiller le forward / back / refresh sur un onglet FireFox, faites-le moi savoir. Sinon, j'ai abandonné l'utilisation de FireBug / FireDiff comme IDE pour CSS, c'est bien, mais lol ... appuyez sur la touche de retour au mauvais moment et TOUT votre travail est parti ... drôle. Donc, vraiment comme le navigateur surligne en CSS / HTML dans Firebug. Connaissez-vous de bons éditeurs CSS qui font cela? J'avais vraiment l'espoir que FireBug fonctionnerait, mais pour l'instant, il ne semble que bon pour l'inspection et les tests ad hoc; ce qui signifie l'utiliser pour ce qu'il est fait.


MISES À JOUR:

@ Lèse majesté: Tout comme une mise à jour, le " module complémentaire de développeur Web " vous permet de modifier le CSS, mais il ne vous permet pas de modifier / enregistrer les modifications CSS apportées par Firebug. Cela signifie que vous utilisez Firebug pour identifier et peut-être tester les modifications, mais cela ne vous permet pas d'enregistrer les modifications de Firebug. Voici un "mode d'emploi" expliquant comment les utiliser ensemble: FF + FB + WD

@ Lèse majesté: Je joue toujours avec FireDiff . Cela fonctionne bien, j'ai déjà trouvé un bogue (même si je ne fais que le contourner), et il n'y a pas de "comment" que j'ai pu trouver, donc j'essaie simplement toutes les fonctionnalités et je clique autour ... (pour Par exemple, pour exporter un diff, vous devez être sur le dernier élément de la liste, cliquer avec le bouton droit et sélectionner "Enregistrer le diff". Le ".diff" est juste un fichier texte, aucune idée pourquoi à ce stade, l'extension est .diff .

Réponses:


10

Il existe en fait un plugin FireBug appelé FireDiff qui vous permet d'exporter les modifications de style et DOM.

Vous pouvez également utiliser le module complémentaire Web Developer pour enregistrer le CSS.

Enfin, FireBug peut être lié à Eclipse à l'aide de Fireclipse , et à partir de là, enregistrez le CSS.

Voir cette question StackOverflow pour plus de solutions.


@ Lèse majesté: Voir le commentaire ci-dessus sur l'utilisation du module complémentaire Web Developer pour modifier le CSS Firebug, merci!
bévues du

2

Je suis sûr que Firebug n'enregistre pas les modifications, vous devrez donc faire preuve de créativité pour le faire. Vous pouvez copier le HTML / CSS et le coller dans un fichier txt. Ensuite, vous pouvez utiliser un logiciel de comparaison pour identifier les modifications que vous avez apportées. L' éditeur de texte que j'utilise a cette fonctionnalité intégrée, mais je suis sûr qu'il existe de nombreuses options disponibles.


2

Vous recherchez Backfire , un script client / serveur (actuellement javascript / C #). Il ne nécessite pas Firebug (ce n'est pas un addon Firebug), et il fonctionne à la fois dans les navigateurs Firefox et Webkit. Avec Backfire, vous pouvez modifier l'état de la page comme vous le souhaitez (Firebug est un excellent moyen), puis cliquez sur le bouton Enregistrer pour enregistrer les modifications sur le serveur.

En termes d'implémentation, après avoir cliqué sur enregistrer, votre code côté serveur recevra un article contenant une liste de modifications, et lorsque vous téléchargez Backfire, vous verrez un exemple d'implémentation vous montrant comment stocker les modifications dans vos fichiers CSS. Il fonctionne sur plusieurs fichiers et (dans Firefox) avec des règles CSS abrégées, etc., tout en conservant la structure de vos fichiers CSS d'origine.


(+1) Cool, merci! Comment se connecte-t-il au code? Est-ce que cela fonctionne uniquement avec des fichiers plats, ou peut-il être configuré pour parler à un système de contrôle de version sans écrire de code personnalisé? Je suppose également que cela signifie que je dois également exécuter dot.NET en arrière-plan sur le serveur, non?
bévue

@blunders C'est une source ouverte afin que vous puissiez vérifier comment cela fonctionne vous-même. Fondamentalement, il envoie une liste de modifications au serveur au format json et les données sont analysées à l'aide d'expressions régulières et comparées à la ligne d'origine dans le fichier css. Ensuite, le fichier css est mis à jour avec les nouvelles données. L'exemple d'implémentation est .NET, mais tout programmeur peut facilement en écrire un similaire en PHP ou autre chose car c'est assez trivial.
Rahul

2

Utilisez cssUpdater (premier vrai hit lorsque googler "comment enregistrer les changements de firebug"). Avec lui, vous pouvez enregistrer vos modifications FireBug (même avec le support FTP) en un seul clic depuis FireBug. Plus d'informations sur http://cssUpdater.com

En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.