2. Fixing & Debugging Framer X Common Issues

Framer X is not loading components from the store.

Potential issues:
- Your internet connectivity could be preventing yarn to reach Framer private repositories.
  This might be occurring for multiple reasons (Mostly proxies, corporate connectivity policies, firewalls, Public WiFi proxies, etc).
Troubleshoot:
- Checkout the yarn-error.log file. Look for the following line:
  
  Error: self signed certificate in certificate chain
Solution:
- Open a new terminal window on your Mac.
- Set yarn strict-ssl to false by running: yarn config set strict-ssl false --global
- If you want to enable the SSL configuration on yarn, simply run:
  
  yarn config set strict-ssl true --global

Debugging a Framer X project using the Chrome Dev Tools:
- Generate and load the Live Preview URL on Framer X on Google Chrome.
- To open the Chrome Dev Tools simply use the shortcut Option + Command + I. Learn more about Chrome Dev Tools for Beginners.
- Alternatively you can load the URL from the Framer X Preview Window by using http://0.0.0.0:4567/_app/resources/Vekter/preview.html.
Important: Framer X needs to be running in order to load the URL from the Preview Window.

Installing React Developers Tools on Chrome:
- Go to React Developers Tools Chrome Extension page and install. This will add React debugging tools to the Chrome Dev Tools.
Installing React Developers Tools on Firefox:
- Go to React Developers Tools. This willThis will add React debugging tools to Firefox.
- Generate and load the Live Preview URL on Framer X.
- Alternatively you can load the URL from the Framer X Preview Window by using http://0.0.0.0:4567/_app/resources/Vekter/preview.html
- Furthermore, you can load the full preview experience (with the mockup device) by using http://0.0.0.0:4567/_app/resources/Vekter/preview.html?imageBaseURL=http://0.0.0.0:4567&projectURL=http://0.0.0.0:4567