$message undefined only when compiled using 'npm run prod' #5722
Description
Using Vue 2.6.14 and ant-design-vue. The following bunch of code works ok if compiled using laravel's 'npm run development' but it doesn't work if compiled using 'npm run production', as this.$message is undefined. Does it make any sense? Why would a variable change its value because of that?
axios
.post(url, formData)
.then((r) => {
console.log(this.$message);
this.$message.success("Noticia guardada correctamente");
this.$router.push({ name: "index" });
})
.catch((e) => {
console.log(this.$message)
this.$message.error("Error al guardar la noticia");
})
.finally(() => {
this.saving = false;
});
My scripts at package.json:
"scripts": {
"dev": "npm run development",
"development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --config=node_modules/laravel-mix/setup/webpack.config.js",
"watch": "npm run development -- --watch",
"watch-poll": "npm run watch -- --watch-poll",
"hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
"prod": "npm run production",
"production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --config=node_modules/laravel-mix/setup/webpack.config.js"
},
My webpack.mix.js
const mix = require('laravel-mix');
/*
|--------------------------------------------------------------------------
| Mix Asset Management
|--------------------------------------------------------------------------
|
| Mix provides a clean, fluent API for defining some Webpack build steps
| for your Laravel applications. By default, we are compiling the CSS
| file for the application as well as bundling up all the JS files.
|
*/
mix.js('resources/js/app.js', 'public/js')
.postCss('resources/css/app.css', 'public/css', [
//
]);
mix.js('resources/js/front/app.js', 'public/js/front');
mix.js(
"resources/js/components/admin/pages/news/index.js",
"public/back/news/js/news.js"
);`