前端性能优化66分涨到91分！

vite实现精确精细化css预加载。

首先下载对应的插件：npm i vite-css-preload-plugin

然后再vite.config里：export default defineConfig({ plugins: [preloadCss()] });

然后打包后查看对应的文件。如果html里有<link rel="preload" href="/xx/xx/xx/static/css/index-b66c873d.css" as="style">，则说明预加载成功了。

这个插件的原理是在打包完毕的时候，读取你的html，找到link css，然后加上preload后再复制一条并写入到html。很小的入侵。

目前支持vite>=4  ,  node >= 16.20。

我写这个插件，是因为之前用的css-preload插件，它会吧所有css都预加载。而我只需要在html里用到的那个css，保证首屏快就行了。那么这样的话，它那种一把梭哈css预加载对我来说反而是负优化。

成功打包效果和得分对比见下图：