Flowbite JS配置失效问题排查（无前端框架）

核心原因 #

你通过npm install flowbite安装的包本身已经包含预构建好的flowbite.min.js，只是没找对路径——它在项目根目录的node_modules/flowbite/dist/文件夹里。

两种解决方法 #

方法1：直接引用node_modules中的文件

根据你的HTML文件位置调整路径：

• 若HTML在根目录，在</body>前添加：

<script src="./node_modules/flowbite/dist/flowbite.min.js"></script>

• 若HTML在子文件夹（比如src/index.html），路径修改为：

<script src="../node_modules/flowbite/dist/flowbite.min.js"></script>

方法2：通过打包工具自动引入（更推荐）

如果项目用了Vite、Webpack这类打包工具，直接在入口JS文件（比如src/main.js）中导入Flowbite：

import 'flowbite';

打包时会自动把Flowbite的JS整合到输出文件里，无需手动添加script标签。

额外检查点 #

• 确认npm install flowbite执行成功，项目根目录下存在node_modules/flowbite文件夹
• 若误删dist文件夹，重新执行npm install flowbite即可恢复

内容的提问来源于stack exchange，提问作者AlexSearha