Estaba trabajando en una extensión del navegador Chrome. Cuando traté de conectar firebase con la aplicación web de 2 formas posibles, ninguna funcionó.
import {initializeApp} from 'firebase/app'; import {getFirestore} from 'firebase/firestore';El error que tengo es
Uncaught TypeError: Failed to resolve module specifier "firebase/app". Relative references must start with either "/", "./", or "../". import {initializeApp} from "https://www.gstatic.com/firebasejs/9.4.1/firebase-app.js"; import {getFirestore} from "https://www.gstatic.com/firebasejs/9.4.1/firebase-firestore.js";Como mi proyecto es una extensión de Chrome, tengo un archivo manifest.json que tiene el siguiente formato:
{ "name": "xxx", "manifest_version": 3, "version": "1.0", "permissions": ["cookies","tabs"], "host_permissions": ["<all_urls>"], "action": { "default_popup": "popup.html" }, "content_security_policy": { "extension_pages": "script-src 'self'; object-src 'self'", "sandbox": "sandbox allow-scripts; script-src 'self' 'https://apis.google.com/' 'https://www.gstatic.com/' 'https://*.firebaseio.com' 'https://www.googleapis.com' 'https://ajax.googleapis.com'; object-src 'self'" } }El error que recibí es: (algo salió mal con content_security_policy)
Refused to load the script 'https://www.gstatic.com/firebasejs/9.4.1/firebase-firestore.js' because it violates the following Content Security Policy directive: "script-src 'self'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.Primero, modifique las importaciones de la siguiente manera:
import { initializeApp } from "https://www.gstatic.com/firebasejs/9.4.1/firebase-app.js"; import { getFirestore, collection, getDocs } from "https://www.gstatic.com/firebasejs/9.4.1/firebase-firestore.js";Puede encontrar más información al respecto en la documentación . Dado que está utilizando un paquete de módulos, necesita que se le agregue type="module". El formato correcto debe ser:
<script type="module" src="........”></script>Tenga en cuenta: src depende de cómo establezca la ruta.
También puede consultar el video Primeros pasos con Firebase para la web: conceptos básicos de Firebase . Además, no se puede conectar a Firebase , el error no detectado en Firebase podría agregarse.
Debe reemplazar las referencias https://www.gstatic.com/ en otros archivos
en firebase-firestore.js
import { _registerComponent, registerVersion, _getProvider, getApp, _removeServiceInstance, SDK_VERSION } from 'https://www.gstatic.com/firebasejs/9.6.8/firebase-app.js';cambiar a linea
import { _registerComponent, registerVersion, _getProvider, getApp, _removeServiceInstance, SDK_VERSION } from './firebase-app.js';