React中用Tailwind实现Flowbite文件输入组件样式异常排查

我想在React项目中使用Flowbite的文件<input>元素组件，参考的官方示例样式如下：

由于使用React，我将代码中的class改为className，调整后的代码如下：

<input 
    className="block w-full text-sm text-gray-900 border border-gray-300 rounded-lg cursor-pointer bg-gray-50 dark:text-gray-400 focus:outline-none dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400" 
    aria-describedby="file_input_help" 
    id="file_input" 
    type="file" />

但在我的网站上渲染效果和示例差异很大，尤其是“选择文件”按钮样式异常，呈现为浏览器原生默认样式：

我已安装Tailwind CSS 3.4.0，版本符合Flowbite的要求，请问我遗漏了什么配置或步骤？

内容的提问来源于stack exchange，提问作者Jakob Busk Sørensen