Quick Start

Here is a guide on how to install the Simple Material UI Library, a simple and easy to use UI library for React applications.

Installation

Install the package via npm or yarn:

npm

 npm install simple-material-ui-library

pnpm

 pnpm install simple-material-ui-library

yarn

 yarn install simple-material-ui-library

Tailwind

Install postcss and autoprefixer:

npm install postcss autoprefixer

Note

If you don’t have Tailwind CSS installed, you will need to install it with postcss and autoprefixer:

npm install tailwindcss postcss autoprefixer

Tailwind Configuration

Create a tailwind.config.js file in the root of your project:

npx tailwindcss init -p

Tailwind SetUp

1. Add the following code to your componets property in the tailwind.config.js file:

   tailwind.config.js

   content[...,
   'node_modules/simple-material-ui-library/**/*.{html,js,jsx,ts,tsx}',
   ...],

2. Delete all the code in your index.css and App.css files.

3. Paste this code in your index.css file:

   index.css

   @tailwind base;
   @tailwind components;
   @tailwind utilities;

Using TypeScript

If you are using TypeScript, you will need to add the following code to your tsconfig.json file:

tsconfig.json

{
"target": "ESNext",
"lib": [
  "DOM",
  "DOM.Iterable",
  "ESNext",
],
"module": "ESNext",
"moduleResolution": "Node",
}