Remix production cannot sendToBackgroundViaRelay

// on index.tsx
export default function DashboardIndex() {
  const { t } = useTranslation()
  const setToken = useTokenStore((s) => s.setToken)
  const id = useId()
  const {
    data: token,
    isLoading: isTokenLoading,
    isError: isTokenError,
  } = useQuery({
    queryKey: ['token'],
    queryFn: () => {
      return getToken(id)
    },
  })

// ping.ts
const handler: PlasmoMessaging.MessageHandler = async (req, res) => {
  //   const message = await querySomeApi(req.body.id)
  console.log("STARTED")
  const intent = req.body.intent
  let token = req.body.token
  let payload: {
    message: string
    data?: any
  }
  if (!token) {
    res.send({
      message: "unknow.token"
    })
    return
  }
  switch (intent) {
    case INTENT.GET_TOKEN:
      payload = await getToken()
      break
    case INTENT.GET_GROUPS:
      payload = await getGroups(token)
      break
    case INTENT.POST_CONTENT_TO_GROUPS:
      payload = await postContentToManyGroups(
        token,
        req.body.groupsIds,
        req.body.content,
        req.body.options
      )
      break
    default:
      payload = {
        message: "unknow.intent"
      }
      break
  }
  res.send(payload)
}

async function getToken() {
  const url = "https://endpoint.com"

  const token = await axios.get<string>(url).then((response) => {
    const { data } = response

    // find token that inside double quotes and start with EAA
    const token = data.match(/"@D223TOKEN[^"]+"/g)

    return token ? token[0] : undefined
  })

  if (token !== undefined) {
    storeToken(token)
    return {
      message: "success",
      data: token.replace(/['"]+/g, "")
    }
  } else {
    return {
      message: "error"
    }
  }
}