npm run prod doesn't enable production mode on vue js

Issue

I’m using Laravel with Vuejs. I wanted to publish my website but I keep getting this message in the browser console.

You are running Vue in development mode.
Make sure to turn on production mode when deploying for production.
See more tips at https://vuejs.org/guide/deployment.html

I executed npm run prod and cleared cache on my browser (chrome) but I still keep getting this message.
My webpack.mix.js looks like this:

const mix = require('laravel-mix');

module.exports = {
    mode: 'production',
    resolve: {
        alias: {
            vue: process.env.NODE_ENV == 'production' ? 'vue/dist/vue.min.js' : 'vue/dist/vue.js'
        }
    }
}

mix.js('resources/js/app.js', 'public/js')
   .sass('resources/sass/app.scss', 'public/css');

This is from my package.json:

 "prod": "npm run production",
 "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"

This is what I get when I execute npm run prod

> @ prod /var/www/html/clash
> npm run production


> @ production /var/www/html/clash
> cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-    progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js

Browserslist: caniuse-lite is outdated. Please run next command `npm update`


 DONE  Compiled successfully in 17705ms                                                                                                                                                                                                6:29:11 PM

                                                                                              Asset      Size  Chunks                    Chunk Names
                                                                                   /css/app.css   225 KiB       0  [emitted]         /js/app
                                                                                     /js/app.js   515 KiB       0  [emitted]  [big]  /js/app
   fonts/vendor/@fortawesome/fontawesome-free/webfa-brands-400.eot?    088a34f78f530102fd9661173b4a4f26   129 KiB          [emitted]
   fonts/vendor/@fortawesome/fontawesome-free/webfa-brands-400.svg?    d72293118cda50ec50c39957d9d836d0   692 KiB          [emitted]  [big]
   fonts/vendor/@fortawesome/fontawesome-free/webfa-brands-400.ttf?    273dc9bf9778fd37fa61357645d46a28   129 KiB          [emitted]
 fonts/vendor/@fortawesome/fontawesome-free/webfa-brands-400.woff2?    822d94f19fe57477865209e1242a3c63  74.2 KiB          [emitted]
  fonts/vendor/@fortawesome/fontawesome-free/webfa-brands-400.woff?    f4920c94c0861c537f72ba36590f6362    87 KiB          [emitted]
  fonts/vendor/@fortawesome/fontawesome-free/webfa-regular-400.eot?    3ac49cb33f43a6471f21ab3df40d1b1e  33.6 KiB          [emitted]
  fonts/vendor/@fortawesome/fontawesome-free/webfa-regular-400.svg?    d2e53334c22a9a4937bc26e84b36e1e0   141 KiB          [emitted]
  fonts/vendor/@fortawesome/fontawesome-free/webfa-regular-400.ttf?    ece54318791c51b52dfdc689efdb6271  33.3 KiB          [emitted]
fonts/vendor/@fortawesome/fontawesome-free/webfa-regular-400.woff2?    9efb86976bd53e159166c12365f61e25  13.3 KiB          [emitted]
 fonts/vendor/@fortawesome/fontawesome-free/webfa-regular-400.woff?    a57bcf76c178aee452db7a57b75509b6  16.4 KiB          [emitted]
    fonts/vendor/@fortawesome/fontawesome-free/webfa-solid-900.eot?    7fb1cdd9c3b889161216a13267b55fe2   190 KiB          [emitted]
    fonts/vendor/@fortawesome/fontawesome-free/webfa-solid-900.svg?    7a5de9b08012e4da40504f2cf126a351   829 KiB          [emitted]  [big]
    fonts/vendor/@fortawesome/fontawesome-free/webfa-solid-900.ttf?    2aa6edf8f296a43b32df35f330b7c81c   189 KiB          [emitted]
  fonts/vendor/@fortawesome/fontawesome-free/webfa-solid-900.woff2?    f6121be597a72928f54e7ab5b95512a1  74.3 KiB          [emitted]
   fonts/vendor/@fortawesome/fontawesome-free/webfa-solid-900.woff?    93f284548b42ab76fe3fd03a9d3a2180  96.7 KiB          [emitted]

┌────────────────────────────────────────────────────────┐
│                npm update check failed                 │
│          Try running with sudo or get access           │
│          to the local update config store via          │
│ sudo chown -R $USER:$(id -gn $USER) /home/umut/.config │
└────────────────────────────────────────────────────────┘

┌────────────────────────────────────────────────────────┐
│                npm update check failed                 │
│          Try running with sudo or get access           │
│          to the local update config store via          │
│ sudo chown -R $USER:$(id -gn $USER) /home/umut/.config │
└────────────────────────────────────────────────────────┘

What am I doing wrong?

Solution

I was able to solve the problem.
This was in my layout blade template:

    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>

:facepalm:

Sorry for being stupid.

Answered By – Umut Savas

Answer Checked By – Mary Flores (AngularFixing Volunteer)

Leave a Reply

Your email address will not be published.