Laravel-mix: Async Vue.js Components are not minified in one case since 1.6.0 version

[aleksandrlat]

• Laravel Mix Version: 1.6.0, 1.7.0, 2.0.0 (npm list --depth=0)
• Node Version (node -v): 8.9.4
• NPM Version (npm -v): yarn 1.3.2
• OS: Ubuntu 16.04.3 LTS

Description:

Async Vue.js components are not minified in production mode in case webpack config specified:

.webpackConfig({
    output: { chunkFilename: '[name].js?id=[chunkhash]' }, // ?id=[chunkhash] this is main part
})

If I specify chunkhash like this [name].js?id=[chunkhash] then chunks are not minified anymore. It works well with versions till 1.5.0. But it does not work anymore since 1.6.0
This would be nice to have it back

Steps To Reproduce:

• create package.json

{
  "private": true,
  "scripts": {
    "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
  },
  "dependencies": {
    "vue": "^2.4.2"
  },
  "devDependencies": {
    "babel-plugin-syntax-dynamic-import": "^6.18.0",
    "cross-env": "^5.0.5",
    "laravel-mix": "2.0.0"
  }
}

• create one file veu.js component Component.vue

<template>
    <div>Component</div>
</template>

<script>
    export default {
    }
</script>

• create index.js

import Vue from 'vue'
new Vue({
    el: '#root', // use any selector you need
    components: { index: () => import('./Component.vue') }
})

• create .babelrc to support dynamic imports

{
  "plugins": ["syntax-dynamic-import"]
}

• build index.js with next config webpack.mix.js:

const { mix } = require('laravel-mix')

mix.js('index.js', 'build')
    .version()
    .setPublicPath('build')
    .webpackConfig({
        output: { chunkFilename: '[name].js?id=[chunkhash]' },
    })

[aleksandrlat]

After some investigation and experiments I found solution for myself. This can help someone else.
I added additional config for mix:

mix.options({
    uglify: {
        test: /\.js($|\?)/i
    },
})

And mix started to minify chunks again.

[aleksandrlat]

I found reason of issue in webpack-contrib/uglifyjs-webpack-plugin#220
This was fixed in webpack-contrib/uglifyjs-webpack-plugin#251
And it is added to 1.2.3 milestone of uglifyjs-webpack-plugin. So when 1.2.3 version is released it makes sense to update uglifyjs-webpack-plugin.

[denkata]

Your solution has fixed the problem for me too.

[Insua]

Great,solve my problem

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.