BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.

[symeonmattes]

Expected Behavior:

In an angular12 project I have installed "@influxdata/influxdb-client": "1.25.0", and I have tried to use the example as it is described in

https://github.com/influxdata/influxdb-client-js/blob/master/examples/query.ts

Current Behavior:

I receive a message:

[ng] ./node_modules/@influxdata/influxdb-client/dist/index.mjs:1:28-51 - Error: Module not found: Error: Can't resolve 'http' in '/MyProject/node_modules/@influxdata/influxdb-client/dist'
[ng] BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
[ng] This is no longer the case. Verify if you need this module and configure a polyfill for it.
[ng] If you want to include a polyfill, you need to:
[ng]    - add a fallback 'resolve.fallback: { "http": require.resolve("stream-http") }'
[ng]    - install 'stream-http'
[ng] If you don't want to include a polyfill, you can use an empty module like this:
[ng]    resolve.fallback: { "http": false }
[ng] ./node_modules/@influxdata/influxdb-client/dist/index.mjs:1:51-75 - Error: Module not found: Error: Can't resolve 'https' in '/MyProject/node_modules/@influxdata/influxdb-client/dist'
[ng] BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
[ng] This is no longer the case. Verify if you need this module and configure a polyfill for it.
[ng] If you want to include a polyfill, you need to:
[ng]    - add a fallback 'resolve.fallback: { "https": require.resolve("https-browserify") }'
[ng]    - install 'https-browserify'
[ng] If you don't want to include a polyfill, you can use an empty module like this:
[ng]    resolve.fallback: { "https": false }
[ng] ./node_modules/@influxdata/influxdb-client/dist/index.mjs:1:107-127 - Error: Module not found: Error: Can't resolve 'zlib' in '/MyProject/node_modules/@influxdata/influxdb-client/dist'
[ng] BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
[ng] This is no longer the case. Verify if you need this module and configure a polyfill for it.
[ng] If you want to include a polyfill, you need to:
[ng]    - add a fallback 'resolve.fallback: { "zlib": require.resolve("browserify-zlib") }'
[ng]    - install 'browserify-zlib'
[ng] If you don't want to include a polyfill, you can use an empty module like this:
[ng]    resolve.fallback: { "zlib": false }

Specifications:

• Version: 1.25.0
• Platform: angular 12/ionic

[sranka]

Hi, see https://github.com/influxdata/influxdb-client-js#installation ... if you target browser, use @influxdata/influxdb-client-browser.

[RobRover]

I have the same issue and sranka solution, installing @influxdata/influxdb-client-browser instead of @influxdata/influxdb-client, does not work

[sranka]

@RobRover can you please be more specific about what does not work and how it fails? It is not possible to fail with @influxdata/influxdb-client-browser on the same error. @symeonmattes can you please share your status?

The webpack configuration might affect the results in many ways, the most important when importing the libraries is the order of main fields, see https://webpack.js.org/configuration/resolve/#resolvemainfields . See also https://github.com/influxdata/influxdb-client-js/issues/321#issuecomment-812842447 for a deeper explanation. It seems to me that this issue is related to ionic/webpack, I would be glad if you could share your findings.

[RobRover]

Using React 18, After installing.

npm install --save @influxdata/influxdb-client

npm install --save @influxdata/influxdb-client-apis

I try to use InfluxDB and I het the following error, similar to symeonmattes

Compiled with problems:

ERROR in ./node_modules/@influxdata/influxdb-client/dist/index.mjs 1:0-33

Module not found: Error: Can't resolve 'url' in '/home/cirici/Documents/cirici_projects/react-influx/node_modules/@influxdata/influxdb-client/dist'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
    - add a fallback 'resolve.fallback: { "url": require.resolve("url/") }'
    - install 'url'
If you don't want to include a polyfill, you can use an empty module like this:
    resolve.fallback: { "url": false }

ERROR in ./node_modules/@influxdata/influxdb-client/dist/index.mjs 2:0-26

Module not found: Error: Can't resolve 'http' in '/home/cirici/Documents/cirici_projects/react-influx/node_modules/@influxdata/influxdb-client/dist'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
    - add a fallback 'resolve.fallback: { "http": require.resolve("stream-http") }'
    - install 'stream-http'
If you don't want to include a polyfill, you can use an empty module like this:
    resolve.fallback: { "http": false }

ERROR in ./node_modules/@influxdata/influxdb-client/dist/index.mjs 3:0-27

Module not found: Error: Can't resolve 'https' in '/home/cirici/Documents/cirici_projects/react-influx/node_modules/@influxdata/influxdb-client/dist'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
    - add a fallback 'resolve.fallback: { "https": require.resolve("https-browserify") }'
    - install 'https-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
    resolve.fallback: { "https": false }

ERROR in ./node_modules/@influxdata/influxdb-client/dist/index.mjs 4:0-37

Module not found: Error: Can't resolve 'buffer' in '/home/cirici/Documents/cirici_projects/react-influx/node_modules/@influxdata/influxdb-client/dist'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
    - add a fallback 'resolve.fallback: { "buffer": require.resolve("buffer/") }'
    - install 'buffer'
If you don't want to include a polyfill, you can use an empty module like this:
    resolve.fallback: { "buffer": false }

ERROR in ./node_modules/@influxdata/influxdb-client/dist/index.mjs 5:0-21

Module not found: Error: Can't resolve 'zlib' in '/home/cirici/Documents/cirici_projects/react-influx/node_modules/@influxdata/influxdb-client/dist'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
    - add a fallback 'resolve.fallback: { "zlib": require.resolve("browserify-zlib") }'
    - install 'browserify-zlib'
If you don't want to include a polyfill, you can use an empty module like this:
    resolve.fallback: { "zlib": false }

After running this command

npm install buffer browserify-zlib stream-http url https-browserify

I get less errors but still

Compiled with problems:

ERROR in ./node_modules/@influxdata/influxdb-client/dist/index.mjs 2:0-26

Module not found: Error: Can't resolve 'http' in '/home/cirici/Documents/cirici_projects/react-influx/node_modules/@influxdata/influxdb-client/dist'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
    - add a fallback 'resolve.fallback: { "http": require.resolve("stream-http") }'
    - install 'stream-http'
If you don't want to include a polyfill, you can use an empty module like this:
    resolve.fallback: { "http": false }

ERROR in ./node_modules/@influxdata/influxdb-client/dist/index.mjs 3:0-27

Module not found: Error: Can't resolve 'https' in '/home/cirici/Documents/cirici_projects/react-influx/node_modules/@influxdata/influxdb-client/dist'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
    - add a fallback 'resolve.fallback: { "https": require.resolve("https-browserify") }'
    - install 'https-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
    resolve.fallback: { "https": false }

ERROR in ./node_modules/@influxdata/influxdb-client/dist/index.mjs 5:0-21

Module not found: Error: Can't resolve 'zlib' in '/home/cirici/Documents/cirici_projects/react-influx/node_modules/@influxdata/influxdb-client/dist'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
    - add a fallback 'resolve.fallback: { "zlib": require.resolve("browserify-zlib") }'
    - install 'browserify-zlib'
If you don't want to include a polyfill, you can use an empty module like this:
    resolve.fallback: { "zlib": false }

I also tried to install @influxdata/influxdb-client-browser instead of @influxdata/influxdb-client but still I got the same problem, Thanks

[sranka]

@RobRover I am not much familiar with ionic, it seems to me that it requires a variant of a browser environment that preffers ESM modules. You cannot get into the same problems with @influxdata/influxdb-client-browser, simply because it does not use node libraries at all. After installing @influxdata/influxdb-client-browser, you also have to change your source files to import from @influxdata/influxdb-client-browser in place of @influxdata/influxdb-client. Alternatively, you might try to customize webpack configuration to load a browser version of the library (use module:browser as the first choice in the webpack main fields ... or resolve alias @influxdata/influxdb-client as @influxdata/influxdb-client-browser).

[RobRover]

Firstly sorry, then thanks. I was missing the correct import in the index file. Using "@influxdata/influxdb-client-browser" worked perfectly :)

[symeonmattes]

Hi,

Installing @influxdata/influxdb-client-browser worked for me as well.

Thanks