vue3-styled-components inject导致死循环

npm: vue3-styled-components - npm

低版本浏览器报错(chrome 49)

Uncaught RangeError: Maximum call stack size exceeded

[Vue warn]: Avoid app logic that relies on enumerating keys on a component instance, The keys will be empty in production mode to avoid performance overhead.

高版本浏览器警告 (chrome 84)

[Vue warn]: injection "theme" no found

原因

vue3-styled-componets 中有 inject('theme') 为undefined。

开发环境启动后，在低版本浏览器（chrome 49）中会造成死循环。

解决

在最外层（App.vue） provide('theme','');  即可

其他

@magister_zito/vue3-styled-componentsz

 这个老哥的实现 themKey 用了symbol('theme') 就不好改了。

建议使用其他的vue3 兼容版本，npm 里面有很多fork  的实现