Vue upgrade 8.37->8.38 webpack issues
Hi,
After upgrading from 8.37 -> 8.38 on the vue version, now my vue.config is not working anymore. In your changelog you haven't written anything about breaking changes?
this is what causing errors:
chainWebpack: config => {
config.module
.rule("eslint")
.use("eslint-loader")
.tap(options => {
options.configFile = path.resolve(__dirname, ".eslintrc.js");
return options;
});
config.plugin('copy')
.tap(args => {
args[0].push({
from: path.resolve(__dirname, 'public/media'),
to: path.resolve(__dirname, '../../public/media'),
toType: 'dir',
ignore: ['.DS_Store']
});
args[0].push({
from: path.resolve(__dirname, 'public/media/weplan'),
to: path.resolve(__dirname, '../../public/media/weplan'),
toType: 'dir',
ignore: ['.DS_Store']
});
return args
});
config.plugin('prefetch')
.tap(args => {
return [
{
rel: 'prefetch',
include: 'asyncChunks',
fileBlacklist: [
/\.map$/,
/pdfmake\.[^.]+\.js$/,
/xlsx\.[^.]+\.js$/,
/fabric[^.]*\.[^.]+\.js$/,
/responsivedefaults\.[^.]+\.js$/,
]
}
]
});
},
my entire vue.config can be found here:
https://pastebin.com/ynkwVSXw
Replies (6)
Hi Stephan!
Thank you for your feedback.
In the latest version, we updated vue dependencies and eslint config.
Do you have any errors in your console when running the application?
for the ESLint :
TypeError: Cannot set properties of undefined (setting 'configFile')
at /metronic8.38/vue.config.js:34:30
at Object.tap (/metronic8.38/node_modules/webpack-chain/src/Use.js:14:20)
at chainWebpack (/metronic8.38/vue.config.js:33:10)
at /metronic8.38/node_modules/@vue/cli-service/lib/Service.js:268:40
at Array.forEach (<anonymous>)
at Service.resolveChainableWebpackConfig (/metronic8.38/node_modules/@vue/cli-service/lib/Service.js:268:26)
at Service.resolveWebpackConfig (/metronic8.38/node_modules/@vue/cli-service/lib/Service.js:272:48)
at PluginAPI.resolveWebpackConfig (/metronic8.38/node_modules/@vue/cli-service/lib/PluginAPI.js:132:25)
at serve (/metronic8.38/node_modules/@vue/cli-service/lib/commands/serve.js:75:31)
at Service.run (/metronic8.38/node_modules/@vue/cli-service/lib/Service.js:262:12)
(the config exists)
if I disable that part I get:
TypeError: args[0].push is not a function
at /metronic8.38/vue.config.js:32:19
at Object.tap (/metronic8.38/node_modules/webpack-chain/src/Plugin.js:30:24)
at chainWebpack (/metronic8.38/vue.config.js:31:10)
at /metronic8.38/node_modules/@vue/cli-service/lib/Service.js:268:40
at Array.forEach (<anonymous>)
at Service.resolveChainableWebpackConfig (/metronic8.38/node_modules/@vue/cli-service/lib/Service.js:268:26)
at Service.resolveWebpackConfig (/metronic8.38/node_modules/@vue/cli-service/lib/Service.js:272:48)
at PluginAPI.resolveWebpackConfig (/metronic8.38/node_modules/@vue/cli-service/lib/PluginAPI.js:132:25)
at serve (/metronic8.38/node_modules/@vue/cli-service/lib/commands/serve.js:75:31)
at Service.run (/metronic8.38/node_modules/@vue/cli-service/lib/Service.js:262:12)
and if I disable the copy:
Error: Cannot call .tap() on a plugin that has not yet been defined. Call plugin('prefetch').use(<Plugin>) first.
at Object.tap (/Users/shn/Sites/WePlan2022/Portal/frontend/metronic8.38/node_modules/webpack-chain/src/Plugin.js:26:15)
at chainWebpack (/Users/shn/Sites/WePlan2022/Portal/frontend/metronic8.38/vue.config.js:32:10)
at /Users/shn/Sites/WePlan2022/Portal/frontend/metronic8.38/node_modules/@vue/cli-service/lib/Service.js:268:40
at Array.forEach (<anonymous>)
at Service.resolveChainableWebpackConfig (/Users/shn/Sites/WePlan2022/Portal/frontend/metronic8.38/node_modules/@vue/cli-service/lib/Service.js:268:26)
at Service.resolveWebpackConfig (/Users/shn/Sites/WePlan2022/Portal/frontend/metronic8.38/node_modules/@vue/cli-service/lib/Service.js:272:48)
at PluginAPI.resolveWebpackConfig (/Users/shn/Sites/WePlan2022/Portal/frontend/metronic8.38/node_modules/@vue/cli-service/lib/PluginAPI.js:132:25)
at serve (/Users/shn/Sites/WePlan2022/Portal/frontend/metronic8.38/node_modules/@vue/cli-service/lib/commands/serve.js:75:31)
at Service.run (/Users/shn/Sites/WePlan2022/Portal/frontend/metronic8.38/node_modules/@vue/cli-service/lib/Service.js:262:12)
at processTicksAndRejections (node:internal/process/task_queues:96:5)
So I am suspecting something breaking change to the chainWebpack?
Could you please try to remove the eslint whole configuration module?
If your configuration worked with Metronic v8.0.37, you can try to revert package.json and eslint config from v8.0.37.
Well.. it's not ESLint causing the problems... To me it seems that .38 has a major update in dependencies both bumping vue-cli and other dependencies up a major. so the entire chainWebpack function will not work at all... Can't seem to find any suggestions on the web towards this?
Hi Stephan!
In the latest vue-cli chainWebpack option still exists.
Please make sure that your configuration worked correctly with older versions of Metronic.
I never actually got back on this.. It turned out that my entire vue.config should be rewritten due to many breaking changes in my setup using different plugins..
https://cli.vuejs.org/migrations/migrate-from-v4.html#vue-cli-service
