Angular - publikowanie projektu w sieci

Stronę tą wyświetlono już: 724 razy

W celu opublikowania swojego dzieła w sieci konieczne jest posiadanie serwera (chociażby lokalnego) oraz zbudowanie aplikacji w sposób następujący:

ng build --prod --base-href=/

Dzięki temu twój projekt zostanie skompilowany do postaci, która po wrzuceniu na serwer będzie działała w sposób zoptymalizowany. Optymalizacja polega na tym, że Angular łączy wszystkie style css w jeden plik oraz minifikuje kod javascript umniejszając rozmiary plików zawierających kod. Dzięki takiemu podejściu znacznie spadnie zużycie transferu oraz czas ładowania strony.

To jednak nie wszystko, albowiem konieczne jest jeszcze wprowadzenie pliku .htaccess, w którym to należy umieścić następujący kod:

Listing 1
  1. <IfModule mod_rewrite.c>
  2. RewriteEngine On
  3. # -- REDIRECTION to https (optional):
  4. # If you need this, uncomment the next two commands
  5. # RewriteCond %{HTTPS} !on
  6. # RewriteRule (.*) https://%{HTTP_HOST}%{REQUEST_URI}
  7. # --
  8. RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]
  9. RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d
  10. RewriteRule ^.*$ - [NC,L]
  11. RewriteRule ^(.*) index.html [NC,L]
  12. </IfModule>
  13. <FilesMatch ".(html|htm|js|json|css)$">
  14. <IfModule mod_headers.c>
  15. FileETag None
  16. Header unset ETag
  17. Header unset Pragma
  18. Header unset Cache-Control
  19. Header unset Last-Modified
  20. Header set Pragma "no-cache"
  21. Header set Cache-Control "max-age=0, no-cache, no-store, must-revalidate"
  22. Header set Expires "Mon, 10 Apr 1972 00:00:00 GMT"
  23. </IfModule>
  24. </FilesMatch>

Powyższy kod znaleziony został tutaj i umożliwia on poprawne przeładowanie strony aplikacji bez konieczności używania znacznika # w adresie przeglądarki.

Propozycje książek

Komentarze