Javascript 使用vuejs时，未将firebase脚本标记导入html文件_Javascript_Html_Firebase_Vue.js_Google Cloud Firestore

Javascript 使用vuejs时，未将firebase脚本标记导入html文件

javascript html firebase vue.js google-cloud-firestore

Javascript 使用vuejs时，未将firebase脚本标记导入html文件,javascript,html,firebase,vue.js,google-cloud-firestore,Javascript,Html,Firebase,Vue.js,Google Cloud Firestore,您好，我使用的是安装在VueJs中的版本，我还导入了materialiecss 这也很好，我导入了firebase firestore，所有内容都在index.html文件中。但是，当我试图在另一个vue文件中使用db变量时，它表示未定义db。我不明白为什么会出现此错误，因为物化ECSS工作正常。这是我的HTML文件 <!DOCTYPE html> <html lang=""> <head> <meta charset

您好，我使用的是安装在

VueJs

中的版本，我还导入了

materialiecss

这也很好，我导入了

firebase firestore

，所有内容都在

index.html

文件中。但是，当我试图在另一个

vue

文件中使用

db

变量时，它表示未定义

db

。我不明白为什么会出现此错误，因为

物化ECSS

工作正常。这是我的HTML文件

<!DOCTYPE html>
<html lang="">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
    <title>test</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">
  </head>
  <body>
    <noscript>
      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
    </noscript>
    <div id="app"></div>

    <script src="https://www.gstatic.com/firebasejs/8.2.6/firebase-app.js"></script>
    <script src="https://www.gstatic.com/firebasejs/8.2.6/firebase-analytics.js"></script>
    <script src="https://www.gstatic.com/firebasejs/8.2.6/firebase-firestore.js"></script>
    <script>
      // Your web app's Firebase configuration
      // For Firebase JS SDK v7.20.0 and later, measurementId is optional
      var firebaseConfig = {
        apiKey: "AIzaSyBl17wo7ihuMdACz_iZ3T9rRYZ4_yjSRtI",
        authDomain: "school-boeken.firebaseapp.com",
        projectId: "school-boeken",
        storageBucket: "school-boeken.appspot.com",
        messagingSenderId: "164926430822",
        appId: "1:164926430822:web:a97b3f7bdcec364beb97a7",
        measurementId: "G-M7QE3Y21N2"
      };
      // Initialize Firebase
      firebase.initializeApp(firebaseConfig);
      firebase.analytics();
      var db = firebase.firestore();
    </script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
  </body>
</html>


测试
很抱歉，如果未启用JavaScript，则无法正常工作。请使其继续。
//您的web应用程序的Firebase配置
//对于Firebase JS SDK v7.20.0及更高版本，measurementId是可选的
var firebaseConfig={
apiKey：“Aizasybl17wo7ihumdaz_iZ3T9rRYZ4_yjSRtI”，
authDomain:“school boeken.firebaseapp.com”，
投影：“博肯学校”，
storageBucket:“school boeken.appspot.com”，
messagingSenderId:“164926430822”，
appId:“1:164926430822:web:a97b3f7bdcec364beb97a7”，
测量：“G-M7QE3Y21N2”
};
//初始化Firebase
firebase.initializeApp（firebaseConfig）；
firebase.analytics（）；
var db=firebase.firestore（）；

尝试在

main.js

从“Vue”导入Vue
从“./App.vue”导入应用程序
从“firebase/app”导入firebase
导入“firebase/firestore”
export const db=firebase.initializeApp({
apiKey：“Aizasybl17wo7ihumdaz_iZ3T9rRYZ4_yjSRtI”，
authDomain:“school boeken.firebaseapp.com”，
投影：“博肯学校”，
storageBucket:“school boeken.appspot.com”，
messagingSenderId:“164926430822”，
appId:“1:164926430822:web:a97b3f7bdcec364beb97a7”，
测量：“G-M7QE3Y21N2”
}).firestore（）
export const firestore=firebase.firestore（）
新Vue（{
渲染：h=>h（应用程序）
}).$mount（“#应用程序”）

然后在您可以使用的组件中

从'@/main.js'导入{db}

请添加代码以显示您是如何尝试此操作的。您是否有类似于从“@/plugins/firebase.js”导入firebase的

功能和const db=firebase.firestore（）在你想使用它的Vue文件中？是的，我尝试过，但它给了我一个错误，说找不到模块：错误：无法解析'@/plugins/firebase.js'，这是因为你需要在名为plugins
的目录中创建一个firebase.js
文件，在其中添加firebaseConfig等并导出它。如果您有不同的文件结构，当然也可以。为什么要在main.js
中这样做？在它自己的firebase.js
文件中这样做不是更好的做法吗？我同意。也许你是对的。我同意。也许你是对的。但这一选择有权获得生命）