search

rawilk / laravel-form-components

Form components built for Tailwind & Livewire.
https://randallwilk.dev/docs/laravel-form-components
MIT License
386 stars 42 forks source link

Module build failed #50

Closed victorybiz closed 2 years ago

victorybiz commented 2 years ago

Laravel Form Components Version

v7.0.4

Laravel Version

v9.0.1

Alpine Version

v3.9.0

Bug description

ERROR in ./resources/css/app.css Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js): ModuleBuildError: Module build failed (from ./node_modules/postcss-loader/dist/cjs.js): SyntaxError

(1:1) ...vendor/rawilk/laravel-form-components/resources/css/addons.css @layer components is used but no matching @tailwind components directive is present.

> @layer components {
      ^
        .leading-addon svg {
           @apply h-5 w-5;

Please note in my resources/css/app.css, I have the Tailwind directives imported.

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

@import "../../vendor/rawilk/laravel-form-components/resources/css/index.css";

Steps to reproduce

No response

Relevant log output

No response

rawilk commented 2 years ago

It's failing because css imports have to be at the top of the file. You can import tailwind's directives instead though to get around that.

@import 'tailwindcss/base';
@import 'tailwindcss/components';
@import '../../vendor/rawilk/laravel-form-components/resources/css/index.css';
@import 'tailwindcss/utilities';