我在 Laravel 的 app.css 中定义 Tailwind 的 active/hover 类时出错
我想在我的 Laravel 8 应用中应用 tailwind-starter-kit 我从 html-login-page/login.html 文件中获取了编辑器表单,并且此表单的“登录”页面包含类:
<button class="bg-gray-900 text-white active:bg-gray-700 text-sm
font-bold uppercase px-6 py-3 rounded shadow hover:shadow-lg
outline-none focus:outline-none mr-1 mb-1 w-full"
type="button" style="transition: all 0.15s ease 0s;">
Sign In
</button>
我想在 resources/css/app.css 中设置类定义,如下所示。
.btn_full {
@apply bg-gray-900 text-white active:bg-gray-700 text-sm
font-bold uppercase px-6 py-3 rounded shadow hover:shadow-lg
outline-none focus:outline-none mr-1 mb-1 w-full;
}
但是我收到以下错误。
(623:39) /project_path/resources/css/app.css The
active:bg-gray-700
class does not exist, buthover:bg-gray-700
does. If you're sure thatactive:bg-gray-700
exists, make sure that any@import
statements are being properly processed before Tailwind CSS sees your CSS, as@apply
can only be used for classes in the same CSS tree.621 | 622 | .btn_frontend_submit_w_full { 623 | @apply bg-gray-900 text-white active:bg-gray-700 text-sm font-bold uppercase px-6 py-3 rounded shadow hover:shadow-lg outline-none focus:outline-none mr-1 mb-1 w-full; | ^ 624 | } 625 |
at processResult (/project_path/node_modules/webpack/lib/NormalModule.js:743:19) ...
1 ERROR in child compilations (Use 'stats.children: true' resp. '--stats-children' for more details)
您可以控制在tailwind.config.js文件的“变体”部分中启用悬停变体。活动:前缀仅在元素处于活动状态时适用于实用程序。
976525797