Nuxt3: SEO优化——抽取页面内部Style标签样式

一、需求描述

升级Nuxt 3.12.4之后发现html增大，页面有大量的Style标签引入的css：

为了减少页面加载大小，需要将这些css抽取到独立的css文件中。

二、解决方案

Nuxt官网提供的有关extract css的有关配置大致有以下情况：
在nuxt.config.ts中配置：

（1）如果用的是webpack：

webpack: {extractCSS: true,// orextractCSS: {ignoreOrder: true}
}

详情参考《https://nuxt.com/docs/api/nuxt-config#extractcss》

（2）如果用的是vite:
最新版本的Nuxt 3.12.4：

 features: {inlineStyles: false}

如果没有inlineStyles配置项或者inlineStyles无效，则使用：

experimental: { inlineSSRStyles: false 
}