Compile errors in the Flow App Quickstart on Step 2

šŸ›  Developer Tools FCL
1

I was trying to follow the quick start docs Flow Documentation

I tested these results on: Arch Linux, Ubuntu 20.04 and 20.10 and MacOSX. Unfortunately all attempts produce the same error.

When I get to the configuration step, if I add the line:

import { config } from "@onflow/fcl";

These errors appear:

Compiled with problems:

ERROR in ./node_modules/@improbable-eng/grpc-web-node-http-transport/lib/index.js 8:11-26

Module not found: Error: Can't resolve 'http' in '/home/ldupin/Development/flow/flow-app/node_modules/@improbable-eng/grpc-web-node-http-transport/lib'

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/@improbable-eng/grpc-web-node-http-transport/lib/index.js 10:12-28

Module not found: Error: Can't resolve 'https' in '/home/ldupin/Development/flow/flow-app/node_modules/@improbable-eng/grpc-web-node-http-transport/lib'

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/@improbable-eng/grpc-web-node-http-transport/lib/index.js 12:10-24

Module not found: Error: Can't resolve 'url' in '/Users/ldupin/Development/flow-app/node_modules/@improbable-eng/grpc-web-node-http-transport/lib'

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 }

Am I doing something wrong? Iā€™m following the steps verbatim leading up to the configuration step.

2

I found a bug report being tracked: https://github.com/onflow/fcl-js/issues/934