Element: [Bug Report] $attrs is readonly $listeners is readonly

[fanwei1991]

Element UI version

1.4.7

OS/Browsers version

mac/chrome

Vue version

2.5.2

Reproduction Link

https://github.com/ElemeFE/element/issues/7664

Steps to reproduce

开发环境，表格中的按钮点击时调用this. $confirm() 时，vue会报错：“$attrs is readonly 和 $listeners is readonly”；

What is Expected?

控制台不会弹出错误警告。

What is actually happening?

控制台有$attrs is readonly ，$listeners is readonly 两个错误警告，关闭的时候也会出现

[element-bot]

Translation of this issue:

Element UI version

1.4.7

OS/Browsers version

Mac/chrome

Vue version

2.5.2

Reproduction Link

https://github.com/ElemeFE/element/issues/7664

Steps to reproduce

When the button in the form calls this. $confirm () when the button is clicked, Vue will make a mistake: "$attrs is readonly" and "$listeners is readonly"";

What is Expected?

The console does not popup error warnings.

What is actually happening?

Console with $attrs is readonly, $listeners is readonly two error warning, close will appear

[fanwei1991]

vue 更新到2.52版本之后没有出现此问题

[zhangrunhao]

我把Vue升级到了2.5.7依旧有这个问题

[aleksejevski]

It doesn't work on Vue 2.5.7
But it works again with 2.5.8

[wangduanduan]

i came upon a this issue too, because i use webpack DllPlugin, after i remove webpack DllPlugin, the issue resolved.

so may be the issue is not caused by Vue version, but some tools like webpack.

you can also see https://forum.vuejs.org/t/vue-warn-attrs-is-readonly/18053/8

[MissCuriosity]

马克一下，我也碰到这个问题了

[woodghost]

The same issue here, which is [email protected] & [email protected], both of these are latest version.

[feng89Js]

[email protected] 也遇到这个问题

[cloudGrin]

When I use webpack dllplugin, I also encountered this problem，but later solved。
If you fill in the entry in webpack.dll.config.js is 'vue/dist/vue.esm.js', You need to import the same name in the JS project entry file。
example：
import Vue from 'vue/dist/vue.esm.js'

[kgrosvenor]

Getting this too, anyone know why? Is the logic modifying value props also?

[wanwan1521]

I've updated it to the latest version of the problem that still appears, and I haven't installed webpack dllplugin, a project built in electron-vue. Sorry, English is not very good

[Lighfer]

I use electron-vue and meet this issue too, there is a solution works for me, in webpack.render.config.js:

let whiteListedModules = ['vue'];

change to

let whiteListedModules = ['vue', 'element-ui'];

[wanwan1521]

Thank you very much. Electro-vue is now finished. I'm not responsible for fixing the bug. The bug has been fixed by someone else

[yeyan1996]

l have update Vue to 2.5.22,this problem seem not be appeared

[misterpancn]

The same issue here, which is [email protected] & [email protected]. Using this method to solve the problem

let whiteListedModules = ['vue'];

change to

let whiteListedModules = ['vue', 'element-ui'];

[ezenwankwogabriel]

@misterpancn please where is the whiteListedModules located, cant find it in my build folder

[misterpancn]

@ezenwankwogabriel I created the project using vue-cli, and the whiteListedModules variable is located in the webpack configuration file webpack.renderer.config.js, I hope to help you.

[hale1106]

原因是引入了多个vue的ui库造成的，类似element-ui,iview,vuetify的，解决方案是在webpack.renderer.config.js中把这些库都加入whiteListedModules，如let whiteListedModules = ['vue','element-ui','vuetify']

[dacuotecuo]

I use electron-vue and meet this issue too, there is a solution works for me, in webpack.render.config.js:

let whiteListedModules = ['vue'];

change to

let whiteListedModules = ['vue', 'element-ui'];

it works well

[freedomTT]

please , where is the webpack.renderer.config.js , building project by @vue-cli3 , I can't find webpack.renderer.config.js file.

[garbage-rubbish]

I use electron-vue and meet this issue too, there is a solution works for me, in webpack.render.config.js:

let whiteListedModules = ['vue'];

change to

let whiteListedModules = ['vue', 'element-ui'];

thanks!!

[chenjianan0823]

原因是引入了多个vue的ui库造成的，类似element-ui,iview,vuetify的，解决方案是在webpack.renderer.config.js中把这些库都加入whiteListedModules，如let whiteListedModules = ['vue','element-ui','vuetify']

nice