Using tailwind v3 with lit elements

This page summarizes the projects mentioned and recommended in the original post on dev.to

Our great sponsors
  • SurveyJS - Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App
  • InfluxDB - Power Real-Time Data Analytics at Scale
  • WorkOS - The modern identity platform for B2B SaaS
  • lit-element-starter-ts

    Sample component project using LitElement with TypeScript

  • lit-element-starter-ts

  • PostCSS

    Transforming styles with JS plugins

  • We will be using PostCSS to process our source files' CSS.

  • SurveyJS

    Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

    SurveyJS logo
  • Tailwind CSS

    A utility-first CSS framework for rapid UI development.

  • As part of that, PostCSS will call tailwind to handle the processing of tailwind's classes and what not.

  • postcss-lit

    PostCSS syntax for extracting CSS from template literals inside JS/TS files

  • We need to tell PostCSS how to read JS/TS files, specifically those containing Lit elements. We do that by specifying the syntax as postcss-lit.

  • stylelint

    A mighty CSS linter that helps you avoid errors and enforce conventions.

  • We might also call stylelint so we can lint our source CSS.

  • stylelint-config-standard

    The standard shareable config for Stylelint

  • stylelint-config-standard (optional)

NOTE: The number of mentions on this list indicates mentions on common posts plus user suggested alternatives. Hence, a higher number means a more popular project.

Suggest a related project

Related posts