>source

내 Flutter 웹 앱을 로컬 서버에 성공적으로 설치 한 후 (다음이 대답 Express를 사용하여) localhost에서 flutter 앱을 실행할 수 있습니다. 그러나 액세스하면 콘솔에 오류가 표시됩니다.

main.dart.js:28998 Uncaught ReferenceError: firebase is not defined

내에서 firebase를 설치하고 참조해야한다고 가정합니다. app.js 그러나 나는 실제로 그것이 어떻게되었는지 전혀 모른다 (실제로 이것이 사실이라면). 명령 실행을 시도했습니다. npm install firebase 성공적으로 설치 한 것 같지만 여전히이 오류가 발생합니다.

내가 무엇을 놓치고 있는지 또는이 오류가 발생하는 이유와 해결 방법을 알고 있습니까?

Android Studio를 사용하여 빌드 할 때 Chrome에서 실행하면 프로젝트가 완벽하게 작동하므로 로컬 호스팅과 관련이 있어야합니다.

<시간 />

편집하다

이것은 Chrome에서 Android Studio를 통해 프로젝트를 실행할 때 완벽하게 작동하는 현재 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.
    Fore more details:
    * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/base
  -->
  <base href="/">
  <meta charset="UTF-8">
  <meta content="IE=Edge" http-equiv="X-UA-Compatible">
  <meta name="description" content="App test">
  <!-- 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="my_app">
  <link rel="apple-touch-icon" href="icons/Icon-192.png">
  <!-- Favicon -->
  <link rel="icon" type="image/png" href="favicon.png"/>
  <title>My App</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('flutter-first-frame', function () {
        navigator.serviceWorker.register('flutter_service_worker.js');
      });
    }
  </script>
  <script src="https://maps.googleapis.com/maps/api/js?key=MyGoogleMapsKey"></script>
  <script src="main.dart.js" type="application/javascript"></script>
  <!-- The core Firebase JS SDK is always required and must be listed first -->
  <script src="https://www.gstatic.com/firebasejs/8.1.1/firebase-app.js"></script>
  <!-- TODO: Add SDKs for Firebase products that you want to use
       https://firebase.google.com/docs/web/setup#available-libraries -->
  <script src="https://www.gstatic.com/firebasejs/7.5.1/firebase-auth.js"></script>
  <script src="https://www.gstatic.com/firebasejs/7.5.1/firebase-firestore.js"></script>
  <script>
    <!--  Your web app's Firebase configuration-->
    var firebaseConfig = {
      apiKey: "apiKey",
      authDomain: "my-app.firebaseapp.com",
      databaseURL: "https://myApp.firebaseio.com",
      projectId: "my-app",
      storageBucket: "my-app.appspot.com",
      messagingSenderId: "2243255670923",
      appId: "1:3134567819932:web:f09e90ce142l9ikk0d2f27"
    };
    <!--  Initialize Firebase-->
    firebase.initializeApp(firebaseConfig);
  </script>
</body>
</html>

  • 답변 # 1

    지정된 문서로 firebase 스크립트를 포함하는 것을 잊었을 수 있습니다.

    전체 Firebase 스크립트와 사용중인 서비스를 index.html 웹 폴더에서. 전에 그것을하십시오 <script src="main.dart.js" type="application/javascript"></script> 몸의 라인.

    인증, Firestore 및 분석의 예 :

    <body>
      ...
      <script src="https://www.gstatic.com/firebasejs/7.23.0/firebase-app.js"></script>
      <script src="https://www.gstatic.com/firebasejs/7.23.0/firebase-auth.js"></script>
      <script src="https://www.gstatic.com/firebasejs/7.23.0/firebase-firestore.js"></script>
      <script src="https://www.gstatic.com/firebasejs/7.23.0/firebase-analytics.js"></script>
      ...
    </body>
    
    

관련 자료

  • 이전 algorithm - 루비의 연결 목록이 원하는 출력을 제공하고 오류가 발생하지 않습니다
  • 다음 JavaScript 글꼴 속성을 스크립트로 변경하는 방법은 무엇입니까?