𝗪𝗵𝘆 𝗬𝗼𝘂 𝗦𝗵𝗼𝘂𝗹𝗱 𝗦𝘄𝗶𝘁𝗰𝗵 𝗜𝗰𝗼𝗻 𝗟𝗶𝗯𝗿𝗮𝗿𝗶𝗲𝘀
@expo/vector-icons ਤੋਂ ਅਧਿਕਾਰਤ @react-native-vector-icons ਪੈਕੇਜਾਂ 'ਤੇ ਜਾਣਾ ਤੁਹਾਡੇ ਬੰਡਲ ਸਾਈਜ਼ (bundle size) ਨੂੰ 4MB ਜਾਂ ਇਸ ਤੋਂ ਵੱਧ ਘਟਾ ਦਿੰਦਾ ਹੈ। Expo ਹੁਣ ਇਸ ਤਬਦੀਲੀ ਦੀ ਸਿਫਾਰਸ਼ ਕਰਦਾ ਹੈ।
ਪੁਰਾਣਾ @expo/vector-icons ਇੱਕ ਵੈਪਰ (wrapper) ਸੀ। ਇਸ ਨੇ ਆਈਕਨਾਂ ਨੂੰ Expo Go ਅਤੇ over-the-air ਅਪਡੇਟਸ ਨਾਲ ਕੰਮ ਕਰਨ ਵਿੱਚ ਮਦਦ ਕੀਤੀ। ਹਾਲਾਂਕਿ, ਇਸ ਵੈਪਰ ਨੇ ਗੁੰਝਲਦਾਰਤਾ ਵਧਾ ਦਿੱਤੀ। ਇਸ ਨੂੰ ਚਲਾਉਣ ਲਈ Expo ਨੂੰ Babel transforms ਦੀ ਵਰਤੋਂ ਕਰਨੀ ਪੈਂਦੀ ਸੀ। ਇਸ ਨਾਲ ਵਾਧੂ ਰੱਖ-ਰਖਾਅ (maintenance) ਦਾ ਕੰਮ ਵਧ ਗਿਆ।
ਨਵੇਂ ਪੈਕੇਜ ਵੱਖਰੇ ਤਰੀਕੇ ਨਾਲ ਕੰਮ ਕਰਦੇ ਹਨ। ਉਹ ਸਿੱਧੇ ਤੌਰ 'ਤੇ expo-font ਨਾਲ ਜੁੜਦੇ ਹਨ। ਉਹ native font loading APIs ਦੀ ਵਰਤੋਂ ਕਰਦੇ ਹਨ। ਇਸਦਾ ਮਤਲਬ ਹੈ ਕਿ ਉਹ Expo Go, development builds, ਅਤੇ production apps ਵਿੱਚ ਕੰਮ ਕਰਦੇ ਹਨ।
ਬਦਲਣ ਦੇ ਫਾਇਦੇ:
- ਛੋਟੇ ਬੰਡਲ: ਇੰਪੋਰਟਸ (imports) ਬਦਲਣ ਤੋਂ ਬਾਅਦ ਸਾਡੀ ਟੈਸਟ ਐਪ 4MB ਘਟ ਗਈ।
- ਨਵੇਂ ਆਈਕਨ ਸੈੱਟ: ਤੁਹਾਨੂੰ Lucide ਵਰਗੇ ਸੈੱਟਾਂ ਤੱਕ ਪਹੁੰਚ ਮਿਲਦੀ ਹੈ।
- ਬਿਹਤਰ ਟੂਲਸ: ਤੁਸੀਂ ਆਈਕਨ ਦੇ ਨਾਮਾਂ ਦੀ type-check ਕਰ ਸਕਦੇ ਹੋ।
- ਸਾਫ਼ ਸੈੱਟਅੱਪ: ਤੁਹਾਨੂੰ ਹੁਣ ਹੋਰ ਗੁੰਝਲਦਾਰ aliasing configurations ਦੀ ਲੋੜ ਨਹੀਂ ਹੈ।
ਮਾਈਗ੍ਰੇਟ (migrate) ਕਿਵੇਂ ਕਰੀਏ:
- codemod ਚਲਾਓ: ਆਪਣੇ ਪ੍ਰੋਜੈਕਟ ਰੂਟ ਵਿੱਚ
npx @react-native-vector-icons/codemodਦੀ ਵਰਤੋਂ ਕਰੋ। - ਤਬਦੀਲੀ ਦੀ ਪੁਸ਼ਟੀ ਕਰੋ: ਪੁਰਾਣੇ ਪੈਕੇਜਾਂ ਨੂੰ ਲੱਭਣ ਲਈ
npx expo doctorਚਲਾਓ। - expo-font ਦੀ ਜਾਂਚ ਕਰੋ: ਯਕੀਨੀ ਬਣਾਓ ਕਿ ਇਹ ਇੰਸਟਾਲ ਅਤੇ ਕੰਫਿਗਰ ਹੈ। node_modules ਤੋਂ ਫੌਂਟ ਪਾਥਾਂ (font paths) ਨੂੰ ਸਿੱਧਾ config plugin ਵਿੱਚ ਨਾ ਜੋੜੋ।
ਇਹਨਾਂ ਸਮੱਸਿਆਵਾਂ ਤੋਂ ਸਾਵਧਾਨ ਰਹੋ:
- ਫੌਂਟ ਟਕਰਾਅ (Font conflicts): ਪੁਰਾਣੇ ਅਤੇ ਨਵੇਂ ਪੈਕੇਜਾਂ ਨੂੰ ਮਿਲਾਉਣ ਨਾਲ ਖਾਲੀ ਵਰਗ (squares) ਜਾਂ ਪ੍ਰਸ਼ਨ ਚਿੰਨ੍ਹ (question marks) ਦਿਖਾਈ ਦੇ ਸਕਦੇ ਹਨ।
- ਡਿਪੈਂਡੈਂਸੀ ਸਮੱਸਿਆਵਾਂ (Dependency issues): ਕੁਝ ਲਾਇਬ੍ਰੇਰੀਆਂ ਪੁਰਾਣੇ ਨਾਮਾਂ ਦੀ ਉਮੀਦ ਕਰਦੀਆਂ ਹਨ। ਜੇਕਰ ਤੁਹਾਨੂੰ ਗਲਤੀਆਂ (errors) ਦਿਖਾਈ ਦਿੰਦੀਆਂ ਹਨ, ਤਾਂ ਆਪਣੀਆਂ ਡਿਪੈਂਡੈਂਸੀਆਂ ਦੀ ਜਾਂਚ ਕਰੋ।
Expo ਭਵਿੱਖ ਦੇ ਰਿਲੀਜ਼ ਵਿੱਚ @expo/vector-icons ਨੂੰ ਡਿਪ੍ਰੇਕੇਟ (deprecate) ਕਰ ਦੇਵੇਗਾ। ਹੁਣ ਇਹ ਤਬਦੀਲੀ ਕਰਨ ਨਾਲ ਤੁਹਾਡਾ ਪ੍ਰੋਜੈਕਟ ਸਰਲ ਹੋ ਜਾਵੇਗਾ ਅਤੇ ਪ੍ਰਦਰਸ਼ਨ (performance) ਵਿੱਚ ਸੁਧਾਰ ਹੋਵੇਗਾ।
ਸਰੋਤ: https://dev.to/expo/why-you-should-drop-expovector-icons-for-react-native-vector-icons-3m1n