krauser Posts - Answer Overflow

krauser

•Created by krauser on 11/9/2024 in #👾extension

Uncaught ReferenceError: Cannot access 'yC' before initialization

Having problems importing a third party library with Plasmo. I'm using CSUI with React. The element I'm working on is a single anchor Everything seemingly smooth on VSCode and terminal but when I go to inspect the page the titular problem pops up yC is the bundled name for PrivyProvider, the component that wraps the element Checking some support discussions on the library itself I've seen that some users were seemingly able to integrate this via contentscript, but I do not have access to the source code and they weren't using Plasmo

import { PrivyProvider } from "@privy-io/react-auth"
import cssText from "data-text:~/contents/style.css"
import type {
  PlasmoCSConfig,
  PlasmoCSUIAnchor,
  PlasmoGetInlineAnchor
} from "plasmo"

import { PRIVY_APP_ID } from "../constants/env"

export const getStyle = () => {
  const style = document.createElement("style")
  style.textContent = cssText
  return style
}

export const config: PlasmoCSConfig = {
  matches: ["https://x.com/*"]
}

export const getInlineAnchor: PlasmoGetInlineAnchor = async () =>
  document.querySelector(`body`)

// Use this to optimize unmount lookups
export const getShadowHostId = ({ element }) => `shadow-host-inline-modal`

export default function InlineModal({ anchor }: { anchor?: PlasmoCSUIAnchor }) {
  console.log(PRIVY_APP_ID)
  return (
    <PrivyProvider appId={PRIVY_APP_ID}>hello world</PrivyProvider>
  )
}

import { PrivyProvider } from "@privy-io/react-auth"
import cssText from "data-text:~/contents/style.css"
import type {
  PlasmoCSConfig,
  PlasmoCSUIAnchor,
  PlasmoGetInlineAnchor
} from "plasmo"

import { PRIVY_APP_ID } from "../constants/env"

export const getStyle = () => {
  const style = document.createElement("style")
  style.textContent = cssText
  return style
}

export const config: PlasmoCSConfig = {
  matches: ["https://x.com/*"]
}

export const getInlineAnchor: PlasmoGetInlineAnchor = async () =>
  document.querySelector(`body`)

// Use this to optimize unmount lookups
export const getShadowHostId = ({ element }) => `shadow-host-inline-modal`

export default function InlineModal({ anchor }: { anchor?: PlasmoCSUIAnchor }) {
  console.log(PRIVY_APP_ID)
  return (
    <PrivyProvider appId={PRIVY_APP_ID}>hello world</PrivyProvider>
  )
}

2 replies

Gaming

Programming