如何在 Angular 项目中使用 Flowbite？

Question

我想在我的项目中使用 Flowbite。我执行了以下步骤，但仍然不起作用。

\n

\n

1. 我先安装了 Tailwind，Tailwind 现在工作正常。

   \n
\n

2. 然后我使用 npm 安装了 Flowbite，并将 Flowbite 作为插件添加到 tailwind.config.js 文件中。基于此链接：\n https://flowbite.com/docs/getting-started/quickstart/

   \n

   npm i flowbite

   \n
\n

\n

tailwind.config.js 文件\n\xe2\x80\x8d\xe2\x80\x8d\xe2\x80\x8d\xe2\x80\x8d\xe2\x80\x8d

\n

module.exports = {\n  content: [\n    "./src/**/*.{html,ts}",\n    "./node_modules/flowbite/**/*.js"\n  ],\n  theme: {\n    extend: {},\n  },\n  plugins: [require(\'flowbite/plugin\')]\n}\n

\n

angular.js 文件\n\xe2\x80\x8d\xe2\x80\x8d\xe2\x80\x8d\xe2\x80\x8d\xe2\x80\x8d

\n

"architect": {\n   "build": {\n     "options": {\n        "scripts": ["node_modules/flowbite/dist/flowbite.js"]\n     },\n}\n

\n

我什至使用了下面的包，但它仍然不起作用。

\n

流咬角

\n

https://www.npmjs.com/package/flowbite-angular

\n

Answer 1

我最近遇到了这个问题，我所做的就是根据Vue的实现稍微实现一下我的。

1. npm i flowbite --save
2. 导入组件工作所需的函数

import {
  initAccordions,
  initCarousels,
  initCollapses,
  initDials,
  initDismisses,
  initDrawers,
  initDropdowns,
  initModals,
  initPopovers,
  initTabs,
  initTooltips,
} from 'flowbite';

export class HomeComponent implements OnInit {
  constructor() {}

  ngOnInit(): void {
    initAccordions();
    initCarousels();
    initCollapses();
    initDials();
    initDismisses();
    initDrawers();
    initDropdowns();
    initModals();
    initPopovers();
    initTabs();
    initTooltips();
  }
}

你也可以选择在 tailwind.config.js 中导入 flowbite，但这对我来说没有什么区别。