Troubleshooting
Common issues and solutions when using VueBot.
Widget Not Appearing
If the widget doesn't appear, check the following:
- Ensure the CSS file is loaded before the JavaScript
- Check browser console for errors
- Verify your API key is correct
- Make sure the script is loaded after the DOM is ready
Styles Not Loading
If styles aren't applied:
// Make sure to import CSS in React/Next.js
import '@vuedapt/vuebot/dist/vuebot-widget.css';
// Or include in HTML
<link rel="stylesheet" href="https://unpkg.com/@vuedapt/vuebot@latest/dist/vuebot-widget.css">API Key Errors
If you're getting API key errors:
- Verify your API key is correct and starts with
vb_ - Check that your API key is active in the VueBot dashboard
- Ensure you're using the correct
apiBaseUrl
CORS Issues
If you encounter CORS errors, ensure your API key has the correct domain whitelist configured in the VueBot dashboard.
React/Next.js Issues
For Next.js, make sure to use 'use client' directive:
'use client';
import VueBotWidget from '@vuedapt/vuebot';
import '@vuedapt/vuebot/dist/vuebot-widget.css';Still Having Issues?
If you're still experiencing problems, please check the browser console for error messages and ensure all dependencies are correctly installed.