arco-design / arco-design-vue

A Vue.js 3 UI Library based on Arco Design
https://arco.design/vue
MIT License
2.69k stars 526 forks source link

请教在nuxt3中如何控制arco按需引入的css顺序? #2715

Open popdo opened 1 year ago

popdo commented 1 year ago

基本信息

现有案例

在nuxt3中使用自己的cssrest、unocss等、arco是按需引入的,如何控制css加载顺序。我现在所有css调用出来都在arco的前面。重写样式非常麻烦。

如果禁用了aroc的css,改成手动引入,就无法按需引入了吧

预期解决问题

在nuxt3中使用自己的cssrest、unocss等、arco是按需引入的,如何控制css加载顺序。我现在所有css调用出来都在arco的前面。重写样式非常麻烦。

如果禁用了aroc的css,改成手动引入,就无法按需引入了吧

flsion commented 1 year ago

@popdo 自动导入的样式是根据解析顺序添加的,无法控制,如果需要调整的话,可以把插件中的 css 导入关闭,自行加载下样式文件

popdo commented 1 year ago

@popdo 自动导入的样式是根据解析顺序添加的,无法控制,如果需要调整的话,可以把插件中的 css 导入关闭,自行加载下样式文件

自行引入就是样式文件太大了。480kb。很多时候一个项目可能只用到六七个组件。

GarlandQian commented 1 year ago

这个我老早的时候也遇到了,当时想了个特别不优雅的方式解决。就是在html节点上写个class,然后把所有的自定义样式写在这个class下。有你这个问题的解决办法的话踢我下。

popdo commented 1 year ago

这个我老早的时候也遇到了,当时想了个特别不优雅的方式解决。就是在html节点上写个class,然后把所有的自定义样式写在这个class下。有你这个问题的解决办法的话踢我下。

我现在是关闭arco的css默认导入。手动去引入主题样式,但变成全量引入,css文件大的吓人。本想使用 purgecss进行自动清理无用的样式。但这个模块与unocss冲突。或者通过配置可以实现,但我目前还未实现。