I've a flutter web app that'll run on the localhost perfectly but when I deploy it to firebase I get a blank page. In setting up firebase hosting I selected build/web as my public directory. I ran flutter build web which compiles the app. The build directory is created. My firebase.json file looks fine.(pos-ap/build/web for the public directory is correct)
{
"hosting": {
"public": "pos-app/build/web",
"ignore": [
"firebase.json",
"**/.*",
"**/node_modules/**"
],
"rewrites": [
{
"source": "**",
"destination": "/index.html"
}
]
}
}
Here is my index.html file
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta content="IE=Edge" http-equiv="X-UA-Compatible">
<meta name="description" content="A new Flutter project.">
<!-- iOS meta tags & icons -->
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-title" content="pos">
<link rel="apple-touch-icon" href="icons/Icon-192.png">
<!-- Favicon -->
<link rel="shortcut icon" type="image/png" href="favicon.png"/>
<title>pos</title>
<link rel="manifest" href="manifest.json">
</head>
<body>
<!-- This script installs service_worker.js to provide PWA functionality to
application. For more information, see:
https://developers.google.com/web/fundamentals/primers/service-workers -->
<script>
if ('serviceWorker' in navigator) {
window.addEventListener('load', function () {
navigator.serviceWorker.register('flutter_service_worker.js');
});
}
</script>
<script src="https://www.gstatic.com/firebasejs/7.5.0/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.5.0/firebase-firestore.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.5.0/firebase-auth.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.5.0/firebase-analytics.js"></script>
<script>
// Your web app's Firebase configuration
var firebaseConfig = {
apiKey: "xxxxxxxxxxxxxxxxx",
authDomain: "xxxxxxxxx",
databaseURL: "xxxxxxxxx",
projectId: "xxxxxx",
storageBucket: "sxxxxxxxxxx",
messagingSenderId: "xxxxxxx",
appId: "1:xxxxxxxxx:web:xxxxxxxxxxxx7bc",
measurementId: "G-xxxxxxxxx"
};
// Initialize Firebase
// firebase.initializeApp(firebaseConfig);
firebase.analytics();
</script>
<script src="main.dart.js" type="application/javascript"></script>
</body>
</html>
I'm not really familiar with web stuff. And apologies I can't really offer any more info. I suppose the only clue is that it works on localhost but not when deployed.
My root directory is..
|-pos-app
|-consumer-app
|-firebase.json
I'm trying to deploy pos-app which is a flutter app.