After upgrade quasar Beta from 11 to 16, MQTT library got an error.

[DrakoPOD]

I'm using MQTT in quasar v2, after update quasar this library stop working:

ReferenceError: Buffer is not defined
    at eval (constants.js?885d:46)
    at Object../node_modules/mqtt-packet/constants.js (vendor.js:3424)
    at __webpack_require__ (app.js:315)
    at fn (app.js:579)
    at eval (parser.js?7aac:4)
    at Object../node_modules/mqtt-packet/parser.js (vendor.js:3474)
    at __webpack_require__ (app.js:315)
    at fn (app.js:579)
    at eval (mqtt.js?e7bd:1)
    at Object../node_modules/mqtt-packet/mqtt.js (vendor.js:3444)

[hawkeye64]

Delete node_modules, yarn.lock/package-lock.json, and re-install. If the problem persists, consider using yarn.

[DrakoPOD]

Apparently, this problem is cause by Webpack 5, this versión doesn't included Buffer, because is part of NodeJS not of the browser, need to be added as a plugin, but I don't see webpack config file in quasar for add it.

new webpack.ProvidePlugin({
  Buffer: ['buffer', 'Buffer'],
})

[hawkeye64]

@DrakoPD You'd use chainWebpack or extendWebpack based on the need/usage. https://next.quasar.dev/quasar-cli/handling-webpack#usage-with-quasar-conf-js

[DrakoPOD]

I don't know how to use, never has need before to configure Webpack, I got an error, trying to add a plugin.

     chainWebpack (chain) {
        chain.plugin('eslint-webpack-plugin')
          .use(ESLintPlugin, [{ extensions: [ 'js', 'vue' ] }]);
        chain.plugin('buffer')
          .use(Buffer)
      }

[hawkeye64]

@DrakoPD What's the error? Did you import Buffer first?

[DrakoPOD]

@hawkeye64
Yes, I already imported before and added the npm packet:

(node:7812) UnhandledPromiseRejectionWarning:   ValidationError: Invalid configuration object. 
Webpack has been initialized using a configuration object that does not match the API schema.
   - configuration.plugins[7] misses the property 'apply'. Should be:
     function
     -> The run point of the plugin, required method.

[hawkeye64]

Are you sure it's a webpack plugin? Where is the repo so I can read up on it?

[DrakoPOD]

@hawkeye64
Isn't necessary my repo, I tested in a new quasar project, I didn't change anything, just added the library and call mqtt.connect(), and I got the same error. I also tried add the plugin, error.

[rmtuckerphx]

Getting a similar Buffer is not defined error but am using Quasar CLI w/ Vite and I've already added vite-plugin-node-polyfill.

Here is a summary:

The error is happening in the buffer-from library that is a dependency of microphone-stream.

Here is the polyfill in the quasar.config.js file:

      vitePlugins: [
        [require('vite-plugin-node-polyfills'), { protocolImports: true }],
      ]