Unrecognized command “link” when linking fonts in react native

If you’re working with React Native 0.69 or higher and encounter the error message:

Unrecognized command 'link'

when attempting to link fonts or other assets, this is due to React Native’s switch from manual linking to autolinking. React Native 0.69 and above has removed the link and unlink commands, and now uses autolinking by default. Here are the steps to resolve this issue.

Solution 1: Using react-native-asset

The quickest way to resolve this is by using the react-native-asset command. This tool handles asset linking in newer versions of React Native.

1. Run the following command to link your assets:

   npx react-native-asset

This command automatically links the fonts or assets within your project, making it compatible with React Native 0.69+.

Solution 2: Manual Linking

Since manual linking has been removed in favor of autolinking, you may need to configure asset linking manually within your project. You can do this by creating a react-native.config.js file at the root directory of your project and specifying the assets.

1. Create react-native.config.js at the root of your project:

   module.exports = {
       project: {
           ios: {},
           android: {},
       },
       assets: ['./src/assets/'],
   };

2. Add your assets (such as fonts) in the assets array. This tells React Native where to look for the assets.
3. Run npx react-native-asset again to ensure your assets are linked.

This approach works well if you have a custom directory structure for your assets.

Conclusion

Starting from React Native 0.69, asset linking is much simpler due to autolinking. If you run into issues with the deprecated link command, follow the solutions above to ensure your assets (such as fonts) are properly linked in your project.

This post will help React Native developers adapt to the autolinking changes in version 0.69+. Let me know if you’d like to add anything!