Szybka konwersja szablonu HTML na układ Rails Asset ERB/​​Sass

Question

Ciągle robię to samo, używając projektantów, aby stworzyć ładne Ui, a następnie przekonwertować HTML/CSS, aby podzielić się na potok zasobów i znaleźć i zastąpić ścieżki i znaczniki css + js ; aktualizowanie wszystkiego, aby użyć ścieżki zasobu. Czy jest coś, co automagicznie to robi?

Answer 1

Dla mnie ta sytuacja po prostu głośno dzwoni do sed. Jeśli używasz Linuksa, Mac OS X lub innego * nix, czytaj dalej. (Jeśli twoim środowiskiem programistycznym jest system Windows, ale wdrażasz na serwerze * nix, w którym możesz skonfigurować skrypty po wdrożeniu, to podejście nadal będzie działać.)

Twój projektant ma dostęp do zasobów w lokalnych katalogach, a także wygeneruje tagi, takie jak <img src="images/logo.png">. Ale w przypadku wdrożenia chcesz zastąpić te ścieżki wywołaniami ERB, takimi jak <img src="<%= asset_path 'logo.png' %>">, lub zmienić je tak, aby wskazywały na niektóre zewnętrzne CDN ze znacznikiem takim jak <img src="http://assets.mysite.com/logo.png">, prawda?

W każdym razie sed jest twoim przyjacielem! Sed może (między innymi) przejść przez plik i zastosować w nim zastępcze regex. W sytuacji wywołania ERB (zakładając, że masz już przemianowany plik aby mieć rozszerzenie erb), należy uruchomić polecenie:

$ sed -i 's/\(<img[^>]*src="\)images/\([^"]+\)\("[^>*]>\)/\1<%= asset_path \'\2\' %>\3/g' somefile.html.erb 

Po uruchomieniu tego polecenia somefile.html.erb będzie używany zamiast asset_path ręcznie określone ścieżki obrazu.

Drugi przypadek, w którym świadczą obrazy na innym serwerze, a może po prostu z innej ścieżki, jest podobna:

$ sed -i 's/\(<img[^>]*src="\)images/\([^"]+\)\("[^>*]>\)/\1http:\/\/assets.mysite.com\/\2\3/g' somefile.html 

i Bob to Twój wujek!

Jedną z rzeczy, która denerwuje te polecenia, jest to, że trzeba je uruchamiać na każdym pliku. Cóż, czas na inne narzędzie UNIX, aby przyjść na ratunek: znaleźć. To narzędzie można uruchomić skrypt na kilka plików w drzewie katalogów:

$ find dir/with/html -type f -name '*.html.erb' -exec sed 's/foo/bar/g' {} \; 

Teraz, gdy wiele z powyższych wygląda jak starożytnej łacinie do Ciebie (i nie jesteś biegły w starożytnej łacinie), you” Będziemy chcieli dowiedzieć się więcej o wyrażeń regularnych, aby móc dostosować powyższe polecenia do różnych rodzajów transformacji, jakie chcesz. This to całkiem niezły poradnik używania wyrażeń regularnych i wyrażeń regularnych, które nie wymagają wcześniejszej wiedzy.

Gdy masz zestaw poleceń, które robi to, co właściwe, zapisz je w pliku skryptu powłoki. Następnie uruchom ten plik, kiedy tylko go potrzebujesz, i wykona dla ciebie całą irytującą pracę! To sprawia, że ​​nauka tych wszystkich poleceń wydaje się warta; są bardziej pracochłonne niż ładne GUI, które znajdują się w zastępującym oknie dialogowym, ale elastyczność tego, co robią i możliwość łączenia ich w skrypty oszczędza czas i irytację na dłuższą metę.

Answer 2

Czy próbowałeś już korzystać z asset pipeline outside rails?