React anchor with href renders locally but not in build

I just finished the front-end calculator project and was pretty happy so I decided to go back and try to fix up my quote machine project. It passed the tests but the tweet icon would not render on Netlify.

I spent all of yesterday trying different things to no avail.

Here’s the issue:

          href={"" + state.quote[0]}

Will render on localhost:3000. You can click it and it will work as intended. If I deploy on Netlify it won’t render. The element is there but it is invisible - hence you can pass the tests. If I npm run build and host locally with serve -s build the element also does not render.

Incidentally I can get it to work in a build version using a button with:

const handleClick = () => {
    window.location.href =
      "" +
      state.quote +
      "  -  " +;

You can recreate this by running create react app. Add a href with "" and it will render in build and locally.

Change the href to "" and it will render locally but not in the build version.

Any ideas?

Couldn’t reproduce. Works fine both in dev and prod.

1 Like

4 words: Oh my god, Adblock. I’ve literally spent probably 5 or 6 hours yesterday trying to ‘fix’ this issue and it turns out Adblock was blocking social media icons. Obviously I disabled it on localhost or it ignores it by default.

@jenovs thanks for the confirmation that it was working. The price of privacy is eternal something or other.

1 Like

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.