CODEWITHSUNDEEP
flutterdartflutter-web
Shazamo Morebucks
Shazamo Morebucks

Reputation: 50

How to stop flutter web from overwriting my index.html every build?

So I'm working with flutter web + cloud firestore

To get cloud firestore working I have to modify my index.html. The problem is every time I run

flutter build web

It overwrites my index.html and I have to manually re-add all the necessary code snippets to get it working again.

Is a way I can run flutter build web without it overwriting index.html?

Another related issue is that when I deploy the site to firebase, it works fine, but when I run this site locally for testing using

flutter run -d chrome

when it runs on chrome the site is again using a brand new index.html without the necessary code so it doesn't work. I have no opportunity to edit the index.html to apply the necessary code since it builds and runs immediately.

Is there a fix for this?

Upvotes: 2

Views: 2106

Answers (1)

Spatz
Spatz

Reputation: 20118

You should modify index.html file in the <project>/web folder, but not in the <project>/build/web folder. This file will be copied to <project>/build/web folder during build process.

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>Flutter web</title>
  <link href="https://fonts.googleapis.com/css?family=Raleway&display=swap" rel="stylesheet">
  <script defer src="main.dart.js" type="application/javascript"></script>
  <script src="https://www.gstatic.com/firebasejs/6.6.0/firebase-app.js"></script>
  <script src="https://www.gstatic.com/firebasejs/6.6.0/firebase-auth.js"></script>
</head>

<body>
  <h1>This text will be copied to the target HTML, but covered by flutter web app</h1>
</body>

</html>

Upvotes: 11

Related Questions