Chrome/Sass Sourcemaps, zmiany dokonane w inspektora nie został zapisany w pliku SCSS

Question

Oto krótkie podsumowanie tego, co mówię:

https://medium.com/what-i-learned-building/b4daab987fb0

Podczas korzystania Chrome z obszarów roboczych i sourcemaps skonfigurować, a Połączone pliki lokalne/sieciowe. Mogę użyć inspektora przeglądarki Chrome (w panelu Elementy -> style), aby rozpoznać lokalizację selektora w poprawnym pliku SCSS. Ponadto mogę to kliknąć, przenieść do pliku SCSS, dokonać zmiany, a następnie zapisać go z powodzeniem w systemie plików. Jednak poprzednio pracowałem nad zmianami wprowadzonymi w panelu elementów-> stylów w celu uzyskania aktualizacji w pliku SCSS (tj. Jeśli dokonam zmiany na karcie elementów i sprawdzę plik SCSS w chrome, powinien on to zmienić).

Zamiast tego wprowadza zmiany w pliku CSS. Oczywiście nie jest to bardzo przydatna jako:

• to zostaną zastąpione tak szybko, jak plik SCSS ulega zmianie
• Oznacza to Chrome pokaże style, które nie są w pliku SCSS nawet po przeładowaniu, ponieważ są zapisane w pliku CSS

Próbowałem tego zarówno na OS X jak i Windows, używając Sass 3.3.6. Może również potwierdzić, że nie jest to problem "../", o którym mowa w # 9 https://code.google.com/p/chromium/issues/detail?id=273384, ponieważ plik sass znajduje się teraz w pliku css. W tagu arkusza stylów nie ma również stylów style.css? Ver = x.

Answer 1

https://code.google.com/p/chromium/issues/detail?id=257778 o to pytasz. Poprawianie SCSS w miejsce CSS, gdy panel Style jest edytowany, jest niemożliwe (niejednoznaczne) w ogólnym przypadku, gdy używane są zmienne lub złożone funkcje językowe, więc najlepiej jest Ctrl -wybierz żądaną właściwość CSS w panelu Style do przejdź do odpowiedniego fragmentu SCSS i edytuj zwykły tekst zasobu SCSS, a następnie zapisz (Ctrl + S) i pozwól, aby kompilator sass (działający w trybie obserwacji) wykonał resztę. Powinieneś mieć włączone oba ustawienia Enable CSS source maps i Auto-reload generated CSS, aby DevTools mógł pobierać wygenerowane zmiany CSS.