Jak zapisujesz / eksportujesz zmiany wprowadzone w Firebug?


10

Używając Firebug do edycji CSS, jak zapisać / wyeksportować zmiany dokonane w CSS?

NARZĘDZIA: Firefox , Firebug


GŁÓWNA AKTUALIZACJA: Jeśli znasz sposób na zablokowanie przewijania do przodu / do tyłu / odświeżania na karcie FireFox, daj mi znać. W przeciwnym razie zrezygnowałem z używania FireBug / FireDiff jako IDE dla CSS, to miłe, ale lol ... naciśnij backspace w niewłaściwym czasie i WSZYSTKIE twoje prace zniknęły ... zabawne. Naprawdę podoba mi się podświetlanie przeglądarki do CSS / HTML w Firebug. Znasz dobrych edytorów CSS, którzy to robią? Naprawdę miałem nadzieję, że FireBug zadziała, ale na razie postrzegam go jako dobry do inspekcji i testów ad-hoc; co oznacza użycie go do tego, do czego został stworzony.


AKTUALIZACJE:

@ Lèse majesté: Podobnie jak aktualizacja, „ dodatek Web Developer ” pozwala edytować CSS, ale nie pozwala edytować / zapisywać zmian CSS wprowadzonych przez Firebug. Oznacza to, że używasz Firebug do identyfikowania i może testowania zmian, ale nie pozwala to zapisać zmian z Firebug. Oto „jak to zrobić” obejmujący sposób korzystania z nich razem: FF + FB + WD

@ Lèse majesté: Wciąż bawię się FireDiff . Działa dobrze, znalazłem już jeden błąd (chociaż pracuję nad tym) i nie ma „jak” udało mi się znaleźć, więc po prostu próbuję każdej funkcji i klikam ... (dla na przykład, aby wyeksportować różnicę, musisz znaleźć się nad ostatnim elementem na liście, kliknij prawym przyciskiem myszy i wybierz „Zapisz różnicę”. „.diff” to tylko plik tekstowy, nie mam pojęcia, dlaczego w tym momencie rozszerzenie jest .diff .

Odpowiedzi:


10

W rzeczywistości istnieje wtyczka FireBug o nazwie FireDiff, która pozwala eksportować zmiany stylu i DOM.

Alternatywnie możesz użyć dodatku Web Developer do zapisania CSS.

Na koniec FireBug można połączyć z Eclipse za pomocą Fireclipse , a następnie zapisać CSS.

Zobacz to pytanie StackOverflow, aby uzyskać więcej rozwiązań.


@ Lèse majesté: Zobacz komentarz powyżej na temat używania dodatku Web Developer do edycji Firebug CSS, dzięki!
wpadki

2

Jestem prawie pewien, że Firebug nie rejestruje zmian, więc musisz być trochę kreatywny, aby to zrobić. Możesz skopiować HTML / CSS i wkleić go do pliku txt. Następnie możesz użyć oprogramowania porównawczego do zidentyfikowania dokonanych zmian. Edytor tekstu używam ma tę funkcjonalność wbudowany ale jestem pewien, że jest wiele dostępnych opcji.


2

Szukasz Backfire , skryptu klient / serwer (obecnie javascript / C #). Nie wymaga Firebug (nie jest to dodatek Firebug) i działa zarówno w przeglądarkach Firefox, jak i Webkit. Dzięki Backfire możesz zmienić stan strony w dowolny sposób (Firebug to świetny sposób), a następnie kliknij przycisk Zapisz, aby zapisać zmiany na serwerze.

Jeśli chodzi o implementację, po kliknięciu zapisz kod po stronie serwera otrzymasz post zawierający listę zmian, a po pobraniu Backfire zobaczysz przykładową implementację pokazującą, jak przechowywać zmiany w plikach CSS. Działa w wielu plikach i (w przeglądarce Firefox) z krótszymi regułami CSS itp., A wszystko to przy zachowaniu struktury oryginalnych plików CSS.


(+1) Fajnie, dzięki! Jak zaczepia się w kodzie? Czy działa tylko z płaskimi plikami, czy może można skonfigurować komunikację z systemem kontroli wersji bez pisania niestandardowego kodu? Zgadywanie również oznacza, że ​​muszę również uruchamiać dot.NET w tle na serwerze, prawda?
wpadki

@blunders Jest to oprogramowanie typu open source, dzięki czemu możesz sam sprawdzić, jak to działa. Zasadniczo wysyła listę zmian do serwera w formacie json, a dane są analizowane przy użyciu wyrażeń regularnych i dopasowywane do oryginalnej linii w pliku css. Następnie plik css jest aktualizowany o nowe dane. Przykładową implementacją jest .NET, ale każdy programista może łatwo napisać podobny w PHP lub czymś innym, ponieważ jest to dość trywialne.
Rahul

2

Użyj cssUpdater (pierwszy prawdziwy hit, kiedy googlujesz „jak zapisać zmiany w firebug”). Za jego pomocą możesz zapisać zmiany FireBug (nawet z obsługą FTP) za pomocą jednego kliknięcia z FireBug. Więcej informacji na http://cssUpdater.com

Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.