firebase_core_web

The web implementation of firebase_core.

Usage

Import the package

To use this plugin in your Flutter app on the web, simply add it as a dependency in your pubspec.yaml alongside the base firebase_core plugin.

(This is only temporary: in the future we hope to make this package an "endorsed" implementation of firebase_core, so it will automatically be included in your app when you run your Flutter app on the web.)

Add this to your pubspec.yaml:

...
dependencies:
  ...
  firebase_core: ^0.4.1
  firebase_core_web: ^0.1.0
  ...

Updating index.html

Due to this bug in dartdevc, you will need to manually add the Firebase JavaScript file to your index.html file.

In your app directory, edit web/index.html to add the line:

<html>
    ...
    <body>
        <script src="https://www.gstatic.com/firebasejs/7.5.0/firebase-app.js"></script>
        <script src="main.dart.js"></script>
    </body>
</html>

Initialize Firebase

If you want to initialize the default app, follow the steps in the Firebase Web Setup docs. Specifically, you'll want to add the following lines to your web/index.html file:

<body>
  <!-- Previously loaded Firebase SDKs -->

  <script>
    // TODO: Replace the following with your app's Firebase project configuration
    var firebaseConfig = {
      // ...
    };

    // Initialize Firebase
    firebase.initializeApp(firebaseConfig);
  </script>
  <script src="main.dart.js"></script>
</body> 

Using the plugin

Once you have added the firebase_core_web dependency to your pubspec, you can use package:firebase_core as normal.

Libraries

firebase_core_web

Dart

VM

dart:ffi
Foreign Function Interface for interoperability with the C programming language. [...]

Web

dart:html
HTML elements and other resources for web-based applications that need to interact with the browser and the DOM (Document Object Model). [...]
dart:js
Low-level support for interoperating with JavaScript. [...]
dart:js_util
Utility methods to efficiently manipulate typed JSInterop objects in cases where the name to call is not known at runtime. You should only use these methods when the same effect cannot be achieved with @JS annotations. These methods would be extension methods on JSObject if Dart supported extension methods.