When webpack is packaged, all components display Cannot read property 'vue' of undefined.

problem description

the problem occurs during the period of packaging using webpack, and it runs without any problems. After that, all components defined at the time of packaging will throw

.

TypeError: Cannot read property "vue" of undefined

The same is true of

including App.vue. Components are imported through vue-router and displayed through routing rules, and imported routing objects are mounted in the main function main. Each component is then imported into different components according to different requirements and then mounted.

the environmental background of the problems and what methods you have tried

related codes

components all throw this kind of problem

ERROR in ./src/App.vue
Module build failed (from ./node_modules/_vue-loader@13.5.0@vue-loader/index.js):
TypeError: Cannot read property "vue" of undefined
at Object.module.exports (D:\WebStormDoor\Vue_vide\14\node_modules\_vue-        
loader@13.5.0@vue-loader\lib\loader.js:57:18)
 @ ./src/main.js 43:11-31


what result do you expect? What is the error message actually seen?

I don"t quite understand why there is no problem at run time and why there is an error when compiling and packaging

Mar.10,2022

I have encountered similar problems due to version mismatch in package.json

webpack4^  vue-loader14^ 
Can

provide a reference address where there is a problem? This is convenient to locate the problem.


whether your vue installation instructions are not installed in the packaging environment

MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1ea8d37-47ceb.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1ea8d37-47ceb.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?