I've been facing difficulties in removing the console.log() from my Quasar app for production builds.
Despite checking solutions on various platforms like StackOverflow, Quasar forums, and GitHub, I am still struggling to eliminate the console.log statements and warnings.
I have experimented with different configurations in the
quasar.conf.js
module.exports = function (api) {
build: {
uglifyOptions: {
compress: { drop_console: true },
},
devtool: 'source-map',
sourceMap: true,
chainWebpack(chain) {
chain.optimization.minimizer('js').tap((args) => {
args[0].terserOptions.compress.drop_console = true
args[0].terserOptions.compress.drop_debugger = true
return args
})
}
}
}
module.exports = function (api) {
build: {
uglifyOptions: {
compress: { drop_console: true },
}
}
}
module.exports = function (api) {
build: {
chainWebpack(chain) {
chain.optimization.minimizer('js').tap((args) => {
args[0].terserOptions.compress.drop_console = true
args[0].terserOptions.compress.drop_debugger = true
return args
})
}
}
}
Regardless of trying these methods, the resulting output remains the same.
quasar inspect -c build -p optimization.minimizeroutput
[
TerserPlugin {
options: {
test: /\.[cm]?js(\?.*)?$/i {
[lastIndex]: 0
},
minimizer: {
options: {
compress: {
drop_console: true,
drop_debugger: true
}
}
}
}
]
eslintrc.js
module.exports = {
rules: {
// allow async-await
'generator-star-spacing': 'off',
// allow paren-less arrow functions
'arrow-parens': 'off',
'one-var': 'off',
'optional-chaning': 0,
'import/first': 'off',
'import/named': 'error',
'import/namespace': 'error',
'import/default': 'error',
'import/export': 'error',
'import/extensions': 'off',
'import/no-unresolved': 'off',
'import/no-extraneous-dependencies': 'off',
'prefer-promise-reject-errors': 'off',
'vue/multi-word-component-names': 0,
// allow debugger during development only
'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
},
}