• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Dodanie SSR do aplikacji napisanej w Vue2

VPS Starter Arubacloud
0 głosów
182 wizyt
pytanie zadane 5 lutego 2019 w JavaScript przez BT101 Stary wyjadacz (12,540 p.)
Mam aplikacje napisaną w Vue2. Chcemy dodać do aplikacji SSR ze względu na SEO. Zastanawiam się czy istnieje jakaś szybsza opcja niż przenoszenie całej aplikacji na architekturę nuxt'a?

Przenoszenie na Nuxt będzie dość pracochłonne bo używamy tam wielu pluginów, niektóre nie są dostosowane.

1 odpowiedź

+2 głosów
odpowiedź 5 lutego 2019 przez niezalogowany
wybrane 6 lutego 2019 przez BT101
 
Najlepsza

W prosty sposób można renderować tylko metadane strony. Takie rozwiązanie zadowoli już scrapery facebooka czy twittera.

Jeśli chodzi o pełny SSR, imo nuxt jest najszybszą do implementacji opcją. Korzystając z komponentu no-ssr oraz dodawania pluginów client-side-only - migracja na tę technologię powinna być dość progresywna.

komentarz 6 lutego 2019 przez BT101 Stary wyjadacz (12,540 p.)
edycja 6 lutego 2019 przez BT101

Mimo flagi ssr: false niektóre pluginy jak np. vuex-persistedstate nie działają w 100% poprawnie. Tzn. niby działa ale jak na górze apki jest div, który ma warunek na boolean wyciągnięty ze state i powiedzmy ten bool jest false wtedy do przeglądarki i tak trafia ten div i jest widoczny przez ułamek sekundy po czym znika. Przez to cała aplikacja "skacze". Rozwijałem ten temat na githubie tego plugina jako issue jednakże dostałem odpowiedź, że ten plugin nie był przeznaczony pod SSR podczas tworzenia.

Oprócz tych pluginów jest również wiele innych rzeczy do zmiany - inaczej się używa store, inaczej się używa custom eventów (`this.$nuxt.$emit()`), są pozmieniane urle do zdjęć (odrazu odwołanie do folderu static), inaczej się używa libki axios (`this.$axios` zamiast importowania axios bezpośrednio do komponentu) itd.

Przez tego typu rzeczy trzeba dopisać/zmienić sporo kodu ale mimo wszystko zdecydowaliśmy się przenieść system na Nuxt z myślą o przyszłości a Twoja odpowiedź była bardzo pomocna, dziękuje!

komentarz 21 lutego 2019 przez BT101 Stary wyjadacz (12,540 p.)

Wracam do tej odpowiedzi ponieważ niektóre pluginy działały tylko z użyciem `<no-ssr>`, niektóre z nich miały w sobie content. Również vuex-i18n, którego użyłem do tłumaczeń nie jest w pełni konfigurowalny (lub ja nie zdołałem osiągnąć celu) z Nuxt. Efektem tego było, że niektóre części strony nie były prerenderowane na serwie. Dodatkowo tekst, który trafiał do przeglądarki był zawsze w fallback języku czyli po angielsku, nawet jeżeli wchodziło się na strone domena.de.

To wszystko zmusiło mnie do ponownego researchu i natknąłem się na prerender-spa-plugin. Skonfigurowanie tego pluginu z webpackiem zajęło pare minut.

komentarz 21 lutego 2019 przez niezalogowany
Masz na stronie dynamiczne linki?
komentarz 21 lutego 2019 przez BT101 Stary wyjadacz (12,540 p.)
Akurat ta apka nie ma dynamicznych linków dlatego ten plugin jest idealny.
komentarz 21 lutego 2019 przez niezalogowany
Rzeczywiście, to zmienia postać rzeczy. Nie potrzebujesz SSR

Podobne pytania

0 głosów
1 odpowiedź 332 wizyt
pytanie zadane 3 listopada 2019 w Nasze projekty przez ZenekChe Początkujący (250 p.)
+2 głosów
1 odpowiedź 308 wizyt
pytanie zadane 23 czerwca 2021 w JavaScript przez poldeeek Mądrala (5,980 p.)
0 głosów
1 odpowiedź 164 wizyt
pytanie zadane 7 czerwca 2018 w JavaScript przez BT101 Stary wyjadacz (12,540 p.)

92,453 zapytań

141,262 odpowiedzi

319,088 komentarzy

61,854 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...