نحوه رفع مشکل Stuck Ready Event در Discord Embedded App SDK

اگر Discord’s را دنبال کرده اید ساختن اولین فعالیت شما آموزش، ممکن است با مشکلی مواجه شده باشید که در آن SDK برنامه جاسازی شده بر روی گیر می کند READY رویداد. این مشکل می تواند به دلایل مختلف ایجاد شود، اما شایع ترین علت آن است Vite’s بارگذاری مجدد ماژول داغ (HMR) ویژگی.

ما دیده ایم این مساله بالا آمدن در یک چند مکان مختلف، بنابراین ما می خواستیم یک راهنمای سریع در مورد چگونگی رفع آن ارائه دهیم. این پست آن را با جزئیات بیشتری توضیح می دهد و راه هایی را برای دور زدن آن پیشنهاد می کند.

TLDR; تعمیر سریع

اگر عجله دارید، سریع‌ترین راه برای رفع این مشکل بدون غیرفعال کردن HMR این است که مطمئن شوید فقط یک نمونه از آن را ایجاد می‌کنید. DiscordSDK نزدیک به ریشه برنامه شما وارسی این الگو تا ببینیم چگونه انجام می شود.

شما همچنین می توانید یک جدید ایجاد کنید Discord Activity با اجرای این مورد در ترمینال خود، پروژه را با اصلاحی که قبلاً درج شده است، انجام دهید:

npx create-robo  -k activity

چه اتفاقی می افتد؟

وقتی در حال توسعه یک Discord Activity با به سرعت، ویژگی بارگیری مجدد ماژول داغ می تواند باعث شود SDK چندین بار دوباره ایجاد شود. این بخاطر این است که به سرعت هنگامی که تغییراتی ایجاد می کنید، ماژول را دوباره بارگیری می کند، که می تواند باعث ایجاد تغییرات شود DiscordSDK مجدداً اولیه سازی شود.

متاسفانه، discordSdk.ready() بر روی گیر می کند READY رویداد زیرا Discord در هر نمونه یک بار محموله را ارسال می کند. این بدان معناست که فعالیت شما منتظر خواهد ماند READY رویداد به آتش می‌زند، اما تا زمانی که آن را مجدداً راه‌اندازی نکنید، هرگز چنین نخواهد شد.

شروع تازه با یک اصلاح

برای رفع این مشکل، باید مطمئن شوید که فقط یک نمونه از آن را ایجاد می‌کنید DiscordSDK نزدیک به ریشه برنامه شما به این ترتیب، هر بار که تغییراتی ایجاد می‌کنید، SDK دوباره راه‌اندازی نمی‌شود، بنابراین نیازی به await discordSdk.ready() بیش از یک بار.

ساده‌ترین و سریع‌ترین راه برای جلوگیری از این امر این است که مطمئن شوید از قالبی شروع می‌کنید که قبلاً این اصلاح را در جای خود دارد. تو می توانی این الگو را شبیه سازی کنید یا یک پروژه جدید با اصلاح موجود با اجرای:

npx create-robo  -k activity

این یک جدید ایجاد می کند Discord Activity پروژه را با تعمیر از قبل در محل انجام دهید، بنابراین لازم نیست نگران این مشکل باشید. برای اطلاعات بیشتر راهنمای ما را بررسی کنید!

➞ ✨ راهنما: ایجاد یک Discord Activity در چند ثانیه با Robo.js

تعمیر پروژه موجود شما

اگر در حال حاضر روی پروژه ای کار می کنید و نمی خواهید دوباره شروع کنید، می توانید با اطمینان از اینکه فقط یک نمونه از آن را ایجاد می کنید، این مشکل را برطرف کنید. DiscordSDK نزدیک به ریشه برنامه شما به عنوان مثال، در یک واکنش نشان دهید برنامه، می توانید از یک استفاده کنید متن نوشته برای مدیریت نمونه SDK.

در اینجا یک مثال ساده آورده شده است:

import { DiscordSDK, DiscordSDKMock } from '@discord/embedded-app-sdk'
import { createContext, useContext } from 'react'

export const discordSdk = new DiscordSDK(import.meta.env.VITE_DISCORD_CLIENT_ID)

const DiscordContext = createContext({ discordSdk })

export function DiscordContextProvider(props) {
    const { children } = props
    const setupResult = useDiscordSdkSetup()

    return <DiscordContext.Provider value={setupResult}>{children}DiscordContext.Provider>
}

export function useDiscordSdk() {
    return useContext(DiscordContext)
}

function useDiscordSdkSetup() {
    // Your setup logic here (e.g., discordSdk.ready() in a useEffect)

    return { discordSdk }
}

سپس اعمال کنید DiscordContextProvider در ریشه برنامه شما:

import { DiscordContextProvider } from '../hooks/useDiscordSdk'
import { Activity } from './Activity'
import './App.css'

export default function App() {
    return (
        <DiscordContextProvider>
            <Activity />
        DiscordContextProvider>
    )
}

بدین ترتیب، به سرعت را دوباره راه اندازی نمی کند DiscordSDK هر بار که تغییراتی ایجاد می کنید، در آن گیر نخواهید کرد READY رویداد. اینطوری کار میکنه:

1. این DiscordSDK یک بار ایجاد می شود و از طریق زمینه منتقل می شود.
2. SDK در ارائه دهنده زمینه مقداردهی اولیه می شود.
3. کامپوننت ها می توانند از طریق سفارشی به SDK دسترسی داشته باشند useDiscordSdk قلاب.
4. تا زمانی که شما آن را ویرایش نکنید، همان نمونه SDK دوباره استفاده خواهد شد useDiscordSdk فایل.

نتیجه

واکنش نشان دهید متن نوشته یک راه عالی برای مدیریت وضعیت جهانی در برنامه شما است و برای مدیریت آن عالی است DiscordSDK نمونه، مثال. با اطمینان از اینکه فقط یک نمونه از SDK نزدیک به ریشه برنامه خود ایجاد می کنید، می توانید از READY رویداد از گیر افتادن و اجتناب از نیاز به راه اندازی مجدد فعالیت خود هر بار که تغییرات ایجاد می کنید.

ما به شدت استفاده را توصیه می کنیم create-robo برای ایجاد یک Discord Activity پروژه این الگوها برای کمک به شما برای شروع سریع و جلوگیری از مشکلات رایج مانند این طراحی شده اند. علاوه بر این، آنها با بسیاری از ویژگی ها و ابزارهای دیگر ارائه می شوند تا به شما کمک کنند فعالیت خود را سریعتر و کارآمدتر بسازید، مانند پشتیبانی چند نفره، TypeScript، هاست آسان، تونل های ساده شده، پایگاه داده داخلی، سیستم پلاگین، و خیلی بیشتر!

فراموش نکنید که به سرور Discord ما بپیوندید برای چت کردن با توسعه دهندگان دیگر، پرسیدن سوال و به اشتراک گذاری پروژه های خود. ما اینجا هستیم تا به شما کمک کنیم تا با آن برنامه های شگفت انگیز بسازید Robo.js! 🚀

➞ 🚀 انجمن: به سرور Discord ما بپیوندید

روبوی خودمان، حکیم، برای پاسخ به هر سؤالی در مورد Robo.js، Discord.js و موارد دیگر وجود دارد