Reactfire

Question

我找到了这个 youtube video showing how to get started with reactfire。

我正在尝试对其进行配置，以便我可以使用 React fire，但运行遇到了 webpack 问题。我发现 this post，这表明 ES6 和 reactfire 存在问题，并建议使用 unstable_createRoot 而不是遵循文档。

有人知道如何开始使用 React Fire 吗？

当我尝试使用入门指南时，我收到一条错误消息：

TypeError: Object(...) is not a function

这是我的 index.js

import React, { Component } from 'react';

// import ReactDOM from 'react-dom';
import { createRoot } from 'react-dom';
import { FirebaseAppProvider, 
    useFirestoreDocData,
    useFirestore,
    SuspenseWithPerf } from 'reactfire';

import './index.css';
// import App from './App';
import * as serviceWorker from './serviceWorker';


const devConfig = {
    apiKey: process.env.REACT_APP_DEV_API_KEY,
    authDomain: process.env.REACT_APP_DEV_AUTH_DOMAIN,
    databaseURL: process.env.REACT_APP_DEV_DATABASE_URL,
    projectId: process.env.REACT_APP_DEV_PROJECT_ID,
    storageBucket: process.env.REACT_APP_DEV_STORAGE_BUCKET,
    messagingSenderId: process.env.REACT_APP_DEV_MESSAGING_SENDER_ID,
    appId: process.env.REACT_APP_DEV_APP_ID

  };


  const prodConfig = {
    apiKey: process.env.REACT_APP_PROD_API_KEY,
    authDomain: process.env.REACT_APP_PROD_AUTH_DOMAIN,
    databaseURL: process.env.REACT_APP_PROD_DATABASE_URL,
    projectId: process.env.REACT_APP_PROD_PROJECT_ID,
    storageBucket: process.env.REACT_APP_PROD_STORAGE_BUCKET,
    messagingSenderId: process.env.REACT_APP_PROD_MESSAGING_SENDER_ID,
    appId: process.env.REACT_APP_PROD_APP_ID
  };


  const firebaseConfig =
    process.env.NODE_ENV === 'production' ? prodConfig : devConfig;


    function App() {
        return (
          <FirebaseAppProvider firebaseConfig={firebaseConfig}>
            <h1>test</h1>
            <SuspenseWithPerf
              fallback={<p>loading burrito status...</p>}
              traceId={"load-burrito-status"}
            >
              <p>taskf</p>
            </SuspenseWithPerf>
          </FirebaseAppProvider>
        );
      }

createRoot(document.getElementById("root")).render(<App />);

stackblitz 示例有一个 package.json 文件，其中包含 react 的实验版本 - 尽管这些未在文档或演示视频中指定为要求（并且它指出它应该是没有他们稳定）。

有没有不用实验模式就可以使用reactfire的方法？

// If you want your app to work offline and load faster, you can change
// unregister() to register() below. Note this comes with some pitfalls.
// Learn more about service workers: 
serviceWorker.unregister();

Answer 1

对于其他希望使用它的人，它确实说它用于实验模式 - 但它也说它意味着稳定。

还不稳定。

Google 的 firebase 团队说：

No timeline, sorry. We’ll mark it as stable once concurrent mode is available in stable builds of React.

Reactfire - 入门

Reactfire - getting started

firebase

reactjs