purgeCSS 在 nuxt-tailwindcss 中删除了自定义默认样式

Question

在我的SSR Nuxt.js项目中，我使用的是Nuxt官方tailwindcss-module

我为 <a></a> 标签编写了默认样式，如下所示。

/assets/scss/app.scss

a{
    color: color("blue", "base");
    transition: color .3s ease;

    &:hover,&:active{
        color: color("blue", "darken-4");
    }
}

pages/index.vue

<template>
    <nuxt-link to="/login">Login</nuxt-link>
</template>

nuxt.config.js

    buildModules:['@nuxtjs/tailwindcss'],
    css:['@/assets/scss/app.scss']

当我运行npm run dev时，PurgeCSS 不起作用，所以结果是我预期的。

但是当我运行 npm run prod时，tailwindcss的PurgeCSS会移除我自己在'@/assets/scss/app.scss中的<a></a>标签的样式'

如何配置 tailwind.config.js 以在结果中呈现自定义默认样式？白名单只接受 classnames/ids.

非常感谢！

Answer 1

试试这个

/* purgecss start ignore */
a {...}
/* purgecss end ignore */

custom default styles have been removed by PurgeCSS in nuxt-tailwindcss