Edge components v2

Edge components is a components library for Edge template engine 6 and AdonisJS 6.
This notably facilitates the use of forms.

For AdonisJS 5 please use version 1.


This package require Edge 6, Tailwind with DaisyUi and Alpine (optional)


The first step is to install the package from the npm registry.

npm i @jrmc/edge-components

The next step is to register an Edge plugin.

node ace configure @jrmc/edge-components

Tailwind setup

On your project directory, install the dependencies:

# install dependencies
npm install -D tailwindcss@latest postcss@latest autoprefixer@latest

# create postcss config file
touch postcss.config.js

# create tailwind config file
npx tailwindcss init

Set the postcss.config.js.

export default {
  plugins: {
    tailwindcss: {},
    autoprefixer: {},

Also, make tailwind configs minumum in tailwind.config.js

/** @type {import('tailwindcss').Config} */

import edgeComponent from '@jrmc/edge-components/tailwind.config'

module.exports = {
  content: ['./resources/views/**/*.edge', ...edgeComponent.content],
  plugins: [...edgeComponent.plugins],

add css base in resources/css/app.css

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

Alpine setup (optional)

npm i -D alpinejs

In AdonisJS, you can write the following code block inside the resources/js/app.js file.

import Alpine from 'alpinejs'