Instala npm y la dependencia.
npm init -y
npm install tailwindcss postcss autoprefixer
npx tailwindcss init -p
modifica el archivo tailwind.json.
Hay dos casos, si vas a usar templates/html usa esta configuración
module.exports = {
content: ["./internal/templates/**/*.html"],
theme: {
extend: {},
},
plugins: [],
}
Si vas a usar gomponents usa esta configuración
module.exports = {
content: ["./internal/templates/**/*.go"],
theme: {
extend: {},
},
plugins: [],
}
Ahora modifica el archivo package.json para poder ejecutar un comando de construcción del .css
Crea una carpeta de salida para los archivos .css
mkdir -p internal/static/css
"scripts": {
"build:css": "tailwindcss -i ./internal/static/css/tailwind.css -o ./internal/static/css/output.css --watch"
}
agrega –minify si deseas el .css comprimido
Crea un archivo tailwind.css con este contenido
@tailwind base;
@tailwind components;
@tailwind utilities;
Finalmente, ejecuta el comando para generar el archivo
npm run build:css
Usa el archivo output.css
<link href="/static/css/output.css" rel="stylesheet">
Deja una respuesta