从6.7.3升级到7.0.1后，页面原有样式将被限制加载

[lt1067066026]

Confirmation

• [X] I can confirm this problem is not reproducible with ECharts itself.

How are you introducing Vue-ECharts into your project?

ES Module imports

Versions

"vue": "^3.4.35",
"echarts": "^5.5.1",
"vue-echarts": "^7.0.1",

Details

图表式页面的一个组件，原6.7.3下页面显示全部正常，升级到7.0.1之后页面样式失效。失效位置图表组件所在的父级元素的class没有被注入加载。 使用vue-echarts/csp代替vue-echarts导入，并引入vue-echarts/csp/style.css后页面正常显示了，但自定义的echarts-tooltip样式backdrop-filter属性表现失效。

Reproduction

https://stackblitz.com/edit/vue-echarts-vue-3?file=src%2FApp.vue

[ovo-Tim]

Same issues

[daidaibg]

+1

[daidaibg]

去除style 中的scoped也可恢复样式，但是这并不是想要的方式，昨天想描述没想到好的方式，我本来以为升级vue 或者vite问题样式加载失败，一步一步排查没想到是vue-echart问题，希望尽快解决，7.0.0 7.0.1均有此问题。

[lt1067066026]

去除style 中的scoped也可恢复样式，但是这并不是想要的方式，昨天想描述没想到好的方式，我本来以为升级vue 或者vite问题样式加载失败，一步一步排查没想到是vue-echart问题，希望尽快解决，7.0.0 7.0.1均有此问题。

不去掉scoped也能解决，按照文档中https://github.com/ecomfe/vue-echarts?tab=readme-ov-file#csp-style-src-or-style-src-elem修改导入，这样子虽然页面样式正常了，但是图表样式backdrop-filter属性就不生效

[yqtu]

Yes, I also encountered the same problem

[lt1067066026]

去除style 中的scoped也可恢复样式，但是这并不是想要的方式，昨天想描述没想到好的方式，我本来以为升级vue 或者vite问题样式加载失败，一步一步排查没想到是vue-echart问题，希望尽快解决，7.0.0 7.0.1均有此问题。

不去掉scoped也能解决，按照文档中https://github.com/ecomfe/vue-echarts?tab=readme-ov-file#csp-style-src-or-style-src-elem修改导入，这样子虽然页面样式正常了，但是图表样式backdrop-filter属性就不生效

如果图表提示样式没有使用backdrop-filter属性，可考虑这种方式解决

[daidaibg]

去除style 中的scoped也可恢复样式，但是这并不是想要的方式，昨天想描述没想到好的方式，我本来以为升级vue 或者vite问题样式加载失败，一步一步排查没想到是vue-echart问题，希望尽快解决，7.0.0 7.0.1均有此问题。

不去掉scoped也能解决，按照文档中https://github.com/ecomfe/vue-echarts?tab=readme-ov-file#csp-style-src-or-style-src-elem修改导入，这样子虽然页面样式正常了，但是图表样式backdrop-filter属性就不生效

如果图表提示样式没有使用backdrop-filter属性，可考虑这种方式解决

谢谢，我目前回退6.7.3版本，最新版等作者提出的解决方案。

[daidaibg]

Yes, I also encountered the same problem

说中文🤯

[Justineo]

https://stackblitz.com/edit/vue-echarts-vue-3?file=src%2FApp.vue

请给一个可以运行的最小重现，而不是原封不动地贴一个项目 demo 地址。

[Euraxluo]

+1

[Euraxluo]

https://github.com/ecomfe/vue-echarts/discussions/798

[daidaibg]

https://stackblitz.com/edit/vue-echarts-vue-3?file=src%2FApp.vue

请给一个可以运行的最小重现，而不是原封不动地贴一个项目 demo 地址。

https://github.com/daidaibg/vue-echarts-style-bug
切换vue-echarts 版本至7.0.0以下样式恢复

[poncheen]

I've encountered the same issue as well. Has anyone else used TailwindCSS or UnoCSS?

[Justineo]

We switched to rollup-plugin-import-css in v7 but it’s CSS injection doesn’t seem to play well with Vite. I’ll fix this after I finished my vacation.