mixpanel-js
mixpanel-js copied to clipboard
mixpanel
Importing mixpanel-browser breaks Vite project local development in Firefox
I can't figure out what is going on, but I have a tracking module in a project written in React and using Vite. When I import the mixpanel-browser dependency and set up a simple hook to pass the methods from the SDK down to components, everything works as expected, UNTIL I load the local dev environment in Firefox (latest version). When loaded in Firefox, it displays the following warning in the console:
As you can see, the information there is pretty limited but I have confirmed that removing the mixpanel import does solve the issue and I am able to load my project up just fine. Interestingly enough, when the project is bundled and deployed to our production servers, Firefox functions correctly.
This is an interesting issue and it does gate anyone on the engineering team that does local development in Firefox from using it.
Ran across this while troubleshooting this issue on a Vue3/Vite project but in Chrome
This file failed to load: http://localhost:8080/node_modules/.vite/deps/mixpanel-browser.js?v=cca37e03
Funnily enough it worked fine for me on Firefox on the same machine... then I realised it's because I have an ad blocker installed on Chrome but not Firefox. Turning off the ad blocker on Chrome resolved the issue. Hope that might help someone who ends up here in the future 👍
@TravisC1 Firefox is not my main browser. In fact, I rarely ever even open it, and have no extensions installed. Oddly enough, I do have an ad blocker installed in chrome and that’s works fine. Go figure :)
this also wasn’t just on my machine, the reason I even found this issue is because another engineer on my team was using FF as a dev environment and the code that I wrote to implement mixpanel was working fine for me but not for him. When he loaded it up in chrome he was able to continue developing without being blocked by this.