如何为第 3 部分 CSS 启用 PurgeCSS

Posted 2023-03-07

【中文标题】如何为第 3 部分 CSS 启用 PurgeCSS

【英文标题】：How to enable PurgeCSS for 3rd-part CSS

【发布时间】：2020-09-22 07:26:36

【问题描述】：

我在我的 s-s-r Nuxt 项目中使用@mdi/font。

如何从@mdi/font 为 CSS 启用 purgeCSS？

nuxt.config.js

module.exports = 
    css: [
        '@/assets/scss/app.scss'
    ],
    ...

assets/scss/app.scss

@import '~@mdi/font/css/materialdesignicons';

我尝试像下面这样配置，但它只是删除了所有的 css （示例来自purgecss.com）

nuxt.config.js

module.exports = 
    ...
    build: 
        postcss: 
            plugins: 
                '@fullhuman/postcss-purgecss': 
                    content: ['./pages/**/*.vue', './layouts/**/*.vue', './components/**/*.vue'],
                    whitelist: ['html', 'body']
                
            
        
    

【参考方案1】：

我使用nuxt-purgecss修复了它

nuxt.config.js

module.exports = 
    buildModules: [
        'nuxt-purgecss'
    ]