Flutter web app을 빌드하고 Netlify에 간단하게 배포만 해보자
빌드만 성공하면 어디에 배포하던 상관없지만 개인적으로 Netlify가 가장 편한 것 같다
* 공식문서에서 권장하는 방법은 Firebase Hosting / Github Pages / Google Cloud Hosting
두 가지만 조심하면 되는데, 우선 CORS (교차 출처) 이미지 렌더링 관련 설정이다
크롬에서 Renderer를 canvaskit이 아닌 html을 사용했다면 빌드도 html로 해줘야 한다
flutter build web --web-renderer html --release위 명령어로 web app을 빌드해준다
다음으로 build/web 경로에 생성된 index.html 파일 base 태그의 href 경로를 변경해줘야 한다
[build/web/index.html]
<!DOCTYPE html>
<html>
<head>
<!--
If you are serving your web app in a path other than the root, change the
href value below to reflect the base path you are serving from.
The path provided below has to start and end with a slash "/" in order for
it to work correctly.
For more details:
* https://developer.mozilla.org/en-US/docs/Web/HTML/Element/base
This is a placeholder for base href that will be replaced by the value of
the `--base-href` argument provided to `flutter build`.
-->
<base href="./" />
...경로를 "/"에서 "./"으로 변경 후 파일을 Live Server로 열어 브라우저 렌더링을 확인해준다
toonflix🔽
toonflix
toonflix.netlify.app
'Front-end > Flutter' 카테고리의 다른 글
| [노마드코더] #2 Authentication (0) | 2023.03.06 |
|---|---|
| [노마드코더] #1 Project Setup (0) | 2023.02.12 |
| [TIL] Android 시뮬레이터 실행하기 (Windows) (0) | 2023.02.06 |
| [노마드코더] #6 Webtoon App (0) | 2023.02.02 |
| [노마드코더] #5 Pomodoro App (0) | 2023.01.27 |