The following tailwind className assignment works correctly when running the server in development mode:

<Link href='#pop' className='w-full text-black no-underline'>

Specifically, the class no-underline becomes

text-decoration-line: none;

as shown by the Chrome dev tools.

When I run the following from the command like

NODE_ENV=production npm run build && npm start  

now the same element has

text-decoration: underline;

This results in a UI bug where the anchor tag is no longer rendering correctly, as it did in development.

// tailwind.config.js

module.exports = {
  content: [
    './pages/**/*.{js,ts,jsx,tsx}',
    './components/**/*.{js,ts,jsx,tsx}',
  ],
  theme: {
    extend: {},
  },
  plugins: [],
};

// postcss.config.js

module.exports = {
  plugins: {
    tailwindcss: {},
    autoprefixer: {},
  },
}

/* global.css */

@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
  body {
    height: 100vh;
  }
  .section-title {
    @apply font-bold pb-3 text-2xl;
  }
  .section {
    @apply py-6;
  }

  .discog-box {
    @apply bg-white p-3 flex content-center flex-col;
  }

  .text-shadow-custom {
    text-shadow: 2px 2px 4px #000;
  }
}

There are several other tailwind className assignments that are not working correctly. For this reason, when I deploy my app to Vercel, in this case, the UI is totally broken: https://tunester-8f737wgsk-currenthandle.vercel.app/

https://github.com/currenthandle/tunester/blob/no-moralis/components/IndexPageSideBar.js#L18