چرا باید کتابخانههای آیکون را تغییر دهید
تغییر از @expo/vector-icons به بستههای رسمی @react-native-vector-icons حجم باندل شما را ۴ مگابایت یا بیشتر کاهش میدهد. اکنون Expo این تغییر را توصیه میکند.
نسخه قدیمی @expo/vector-icons یک wrapper بود. این بسته کمک میکرد تا آیکونها با Expo Go و بهروزرسانیهای over-the-air کار کنند. با این حال، این wrapper باعث پیچیدگی میشد. Expo مجبور بود برای کارکرد آن از Babel transforms استفاده کند که این امر باعث ایجاد کارهای نگهداری اضافی میشد.
بستههای جدید به گونهای متفاوت عمل میکنند. آنها مستقیماً با expo-font ادغام میشوند و از APIهای بومی (native) بارگذاری فونت استفاده میکنند. این یعنی آنها در Expo Go، نسخههای توسعه (development builds) و اپلیکیشنهای تولید (production) به درستی کار میکنند.
مزایای تغییر:
- باندلهای کوچکتر: اپلیکیشن تست ما پس از تغییر importها، ۴ مگابایت کوچکتر شد.
- مجموعهآیکونهای جدیدتر: شما به مجموعههایی مانند Lucide دسترسی خواهید داشت.
- ابزارهای بهتر: میتوانید نام آیکونها را type-check کنید.
- تنظیمات سادهتر: دیگر نیازی به پیکربندیهای پیچیده aliasing ندارید.
نحوه مهاجرت:
- اجرای codemod: از
npx @react-native-vector-icons/codemodدر ریشه پروژه خود استفاده کنید. - تأیید تغییرات: دستور
npx expo doctorرا اجرا کنید تا بستههای قدیمی را پیدا کنید. - بررسی
expo-font: مطمئن شوید که نصب و پیکربندی شده است. مسیرهای فونت را مستقیماً ازnode_modulesبه config plugin اضافه نکنید.
مراقب این موارد باشید:
- تداخل فونت: ترکیب بستههای قدیمی و جدید باعث نمایش مربعهای خالی یا علامتهای سوال میشود.
- مشکلات وابستگی: برخی کتابخانهها انتظار نامهای قدیمی را دارند. اگر با خطا مواجه شدید، وابستگیهای خود را بررسی کنید.
Expo در نسخههای آینده @expo/vector-icons را منسوخ (deprecate) خواهد کرد. انجام این تغییر در حال حاضر، پروژه شما را سادهتر کرده و عملکرد آن را بهبود میبخشد.
منبع: https://dev.to/expo/why-you-should-drop-expovector-icons-for-react-native-vector-icons-3m1n