tailwindcss-breakpoints-indicators

💻・About

The tailwindcss-breakpoints-indicators package is a handy tool for displaying breakpoints TailwindCSS

🎯・Installation

1. Install tailwindcss-breakpoints-indicators package

$ npm i -D tailwindcss-breakpoints-indicators

2. Setup

Edit your index.html at the root of your project to start using tailwindcss-breakpoints-indicators. Add before closing the tag

<script type="module">
  import displayTailwindBreakPointsIndicators from "tailwindcss-breakpoints-indicators";
  displayTailwindBreakPointsIndicators();
</script>

3. Exclude dependency from buil

Vite

export default defineConfig({
  // ...
  build: {
    rollupOptions: {
      external: ["tailwindcss-breakpoints-indicators"],
    },
  },
  // ..
});

4. Enjoy !

🧑‍🤝‍🧑・Contributing

To contribute to tailwindcss-breakpoints-indicators in development, follow these steps:

1. Fork the project.

2. Create a branch with conventionnal name.

   • fix: bugfix/the-bug-fixed
   • features: feature/the-amazing-feature
   • test: test/the-famous-test
   • hotfix hotfix/oh-my-god-bro
   • wip wip/the-work-name-in-progress

🎯・Roadmap

• [ ] Create automatic setup
• [ ] Ability to choose indicator style
• [ ] Ignore dependency during project compilation (Webpack, Parcel, Babel)

📑・Licence

This project is under MIT license. For more information, please see the file LICENSE.