Install Preline UI with Angular using Tailwind CSS

Setting up Preline UI in a Angular project using Tailwind CSS.

Quick Angular setup

A JavaScript framework for dynamic web applications. If you haven't set up Tailwind CSS yet, check out Angular Tailwind CSS installation guides.

Preline UI + Angular
  1. Install Preline UI

    Install preline via npm or yarn.

    // Terminal or Shellnpm install preline // or yarn add preline
  2. Configure Preline UI JavaScript paths

    Add the path to Preline UI JavaScript files in your tailwind.config.js file.

    // tailwind.config.jsmodule.exports = {  content: [      'node_modules/preline/dist/*.js',  ],  plugins: [      require('preline/plugin'),  ],}
  3. Add the Preline UI JavaScript

    Include the JavaScript <script> that powers the interactive elements near the end of your <body> tag:

    // index.html<script src="./node_modules/preline/dist/preline.js"></script>