search

NotionX / react-notion-x

Fast and accurate React renderer for Notion. TS batteries included. ⚡️
https://react-notion-x-demo.transitivebullsh.it
MIT License
4.87k stars 570 forks source link

Can't await NotionAPI getPage #264

Closed EC-Sol closed 2 years ago

EC-Sol commented 2 years ago

Description

This is my github repository. You can get full code here. https://github.com/EC-Sol/react-notion-x-cra-test

This Project created CRA (React 18) template typescript using yarn v3 pnp zero-installs. Create-React-App process command this.

$ mkdir yarn-berry
$ cd yarn-berry

$ yarn set version berry
$ rm package.json
$ yarn dlx create-react-app react-notion-x-cra-test --template typescript

$ cd react-notion-x-cra-test
$ yarn plugin import plugin-interactive-tool
$ yarn plugin import typescript

# Upgrade all of dependencies latest
$ yarn upgrade-interactive

# For remove test library error
$ yarn add -D @types/testing-library__jest-dom

$ yarn add react-notion-x notion-client

Then modify index.tsx, App.tsx

/** 
  *  index.tsx
  *  Modify render method React 17 to React 18
  */

import React from 'react';
import ReactDOM from 'react-dom';
import { createRoot } from 'react-dom/client';
import './index.css';
import App from './App';
import reportWebVitals from './reportWebVitals';

const root = createRoot(document.getElementById('root')!);

root.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>
);

// If you want to start measuring performance in your app, pass a function
// to log results (for ex ample: reportWebVitals(console.log))
// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
reportWebVitals();
/**
  *  App.tsx
  *  Add react-notion-x code
  */

import React from 'react';
import logo from './logo.svg';
import './App.css';

import { NotionAPI } from 'notion-client';

function App() {
  const notion = new NotionAPI();

  const recordMap = await notion.getPage('067dd719a912471ea9a3ac10710e7fdf')

  return (
    <div className="App">
      <header className="App-header">
        <img src={logo} className="App-logo" alt="logo" />
        <p>
          Edit <code>src/App.tsx</code> and save to reload.
        </p>
        <a
          className="App-link"
          href="https://reactjs.org"
          target="_blank"
          rel="noopener noreferrer"
        >
          Learn React
        </a>
      </header>
    </div>
  );
}

export default App;

package.json dependencies:

...
"dependencies": {
    "@testing-library/jest-dom": "^5.16.4",
    "@testing-library/react": "^13.0.0",
    "@testing-library/user-event": "^14.1.0",
    "@types/jest": "^27.4.1",
    "@types/node": "^17.0.23",
    "@types/react": "^18.0.1",
    "@types/react-dom": "^18.0.0",
    "notion-client": "^6.9.3-6.10.0-alpha.0.0",
    "react": "^18.0.0",
    "react-dom": "^18.0.0",
    "react-notion-x": "^6.9.3-6.10.0-alpha.0.0",
    "react-scripts": "5.0.0",
    "typescript": "^4.6.3",
    "web-vitals": "^2.1.4"
  },
...

TS1308: 'await' expressions are only allowed within async functions and at the top levels of modules.

image

This is Terminal Error

ERROR in ./src/App.tsx
Module build failed (from ./.yarn/__virtual__/babel-loader-virtual-d0e333cab8/0/cache/babel-loader-npm-8.2.4-e2dfcd123f-4968251fc4.zip/node_modules/babel-loader/lib/index.js):
SyntaxError: I:\workspace\yarn-berry\react-notion-x-cra-test\src\App.tsx: Unexpected reserved word 'await'. (10:20)

   8 |   const notion = new NotionAPI();
   9 |
> 10 |   const recordMap = await notion.getPage('067dd719a912471ea9a3ac10710e7fdf')
     |                     ^
  11 |
  12 |   return (
  13 |     <div className="App">
    at instantiate (I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\@babel-parser-npm-7.17.9-c161ea59b5-ea59c985eb.zip\node_modules\@babel\parser\lib\index.js:72:32)
    at constructor (I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\@babel-parser-npm-7.17.9-c161ea59b5-ea59c985eb.zip\node_modules\@babel\parser\lib\index.js:358:12)
    at Object.raise (I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\@babel-parser-npm-7.17.9-c161ea59b5-ea59c985eb.zip\node_modules\@babel\parser\lib\index.js:3335:19)
    at Object.checkReservedWord (I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\@babel-parser-npm-7.17.9-c161ea59b5-ea59c985eb.zip\node_modules\@babel\parser\lib\index.js:14046:12)
    at Object.checkReservedWord (I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\@babel-parser-npm-7.17.9-c161ea59b5-ea59c985eb.zip\node_modules\@babel\parser\lib\index.js:10132:13)
    at Object.parseIdentifierName (I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\@babel-parser-npm-7.17.9-c161ea59b5-ea59c985eb.zip\node_modules\@babel\parser\lib\index.js:13985:12)
    at Object.parseIdentifier (I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\@babel-parser-npm-7.17.9-c161ea59b5-ea59c985eb.zip\node_modules\@babel\parser\lib\index.js:13955:23)
    at Object.parseExprAtom (I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\@babel-parser-npm-7.17.9-c161ea59b5-ea59c985eb.zip\node_modules\@babel\parser\lib\index.js:12985:27)
    at Object.parseExprAtom (I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\@babel-parser-npm-7.17.9-c161ea59b5-ea59c985eb.zip\node_modules\@babel\parser\lib\index.js:8034:20)
    at Object.parseExprSubscripts (I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\@babel-parser-npm-7.17.9-c161ea59b5-ea59c985eb.zip\node_modules\@babel\parser\lib\index.js:12540:23)
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in Failed to load config "react-app" to extend from.
Referenced from: I:\workspace\yarn-berry\react-notion-x-cra-test\package.json

webpack 5.72.0 compiled with 2 errors in 171 ms
ERROR in src/App.tsx:10:21
TS1308: 'await' expressions are only allowed within async functions and at the top levels of modules.
     8 |   const notion = new NotionAPI();
     9 |
  > 10 |   const recordMap = await notion.getPage('067dd719a912471ea9a3ac10710e7fdf')
       |                     ^^^^^
    11 |
    12 |   return (
    13 |     <div className="App">

Notion Test Page ID

const recordMap = await notion.getPage('067dd719a912471ea9a3ac10710e7fdf')

EC-Sol commented 2 years ago

I tried App.tsx file modify below.

...
const recordMap = async () => await notion.getPage('067dd719a912471ea9a3ac10710e7fdf')
...

Then result ocurr 38 errors below.

ERROR in ./.yarn/cache/@szmarczak-http-timer-npm-4.0.6-6ace00d82d-c29df3bcec.zip/node_modules/@szmarczak/http-timer/dist/source/index.js 9:15-30
Module not found: Error: Can't resolve 'util' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\@szmarczak-http-timer-npm-4.0.6-6ace00d82d-c29df3bcec.zip\node_modules\@szmarczak\http-timer\dist\source'

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: { "util": require.resolve("util/") }'
        - install 'util'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "util": false }
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 22:21-53
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/cacheable-lookup-npm-5.0.4-8f13e8b44b-763e02cf91.zip/node_modules/cacheable-lookup/source/index.js 11:4-18
Module not found: Error: Can't resolve 'dns' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\cacheable-lookup-npm-5.0.4-8f13e8b44b-763e02cf91.zip\node_modules\cacheable-lookup\source'
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 24:27-54
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/cacheable-lookup-npm-5.0.4-8f13e8b44b-763e02cf91.zip/node_modules/cacheable-lookup/source/index.js 15:4-19
Module not found: Error: Can't resolve 'util' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\cacheable-lookup-npm-5.0.4-8f13e8b44b-763e02cf91.zip\node_modules\cacheable-lookup\source'

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: { "util": require.resolve("util/") }'
        - install 'util'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "util": false }
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 24:27-54
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/cacheable-lookup-npm-5.0.4-8f13e8b44b-763e02cf91.zip/node_modules/cacheable-lookup/source/index.js 17:11-24
Module not found: Error: Can't resolve 'os' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\cacheable-lookup-npm-5.0.4-8f13e8b44b-763e02cf91.zip\node_modules\cacheable-lookup\source'

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: { "os": require.resolve("os-browserify/browser") }'
        - install 'os-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "os": false }
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 24:27-54
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/cacheable-request-npm-7.0.2-e64cc641fc-6152813982.zip/node_modules/cacheable-request/src/index.js 3:21-38
Module not found: Error: Can't resolve 'events' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\cacheable-request-npm-7.0.2-e64cc641fc-6152813982.zip\node_modules\cacheable-request\src'

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: { "events": require.resolve("events/") }'
        - install 'events'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "events": false }
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 26:25-53
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/cacheable-request-npm-7.0.2-e64cc641fc-6152813982.zip/node_modules/cacheable-request/src/index.js 5:15-29
Module not found: Error: Can't resolve 'url' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\cacheable-request-npm-7.0.2-e64cc641fc-6152813982.zip\node_modules\cacheable-request\src'

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 }
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 26:25-53
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/clone-response-npm-1.0.2-135ae8239d-2d0e61547f.zip/node_modules/clone-response/src/index.js 3:20-49
Module not found: Error: Can't resolve 'stream' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\clone-response-npm-1.0.2-135ae8239d-2d0e61547f.zip\node_modules\clone-response\src'

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: { "stream": require.resolve("stream-browserify") }'
        - install 'stream-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "stream": false }
 @ ./.yarn/cache/cacheable-request-npm-7.0.2-e64cc641fc-6152813982.zip/node_modules/cacheable-request/src/index.js 17:22-47
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 26:25-53
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/compress-brotli-npm-1.3.6-88880660b1-9db8e082a3.zip/node_modules/compress-brotli/src/index.js 5:4-19
Module not found: Error: Can't resolve 'util' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\compress-brotli-npm-1.3.6-88880660b1-9db8e082a3.zip\node_modules\compress-brotli\src'

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: { "util": require.resolve("util/") }'
        - install 'util'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "util": false }
 @ ./.yarn/cache/keyv-npm-4.2.2-d1668ef518-1d03674145.zip/node_modules/keyv/src/index.js 7:23-49
 @ ./.yarn/cache/cacheable-request-npm-7.0.2-e64cc641fc-6152813982.zip/node_modules/cacheable-request/src/index.js 19:13-28
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 26:25-53
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/compress-brotli-npm-1.3.6-88880660b1-9db8e082a3.zip/node_modules/compress-brotli/src/index.js 9:13-28
Module not found: Error: Can't resolve 'zlib' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\compress-brotli-npm-1.3.6-88880660b1-9db8e082a3.zip\node_modules\compress-brotli\src'

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 }
 @ ./.yarn/cache/keyv-npm-4.2.2-d1668ef518-1d03674145.zip/node_modules/keyv/src/index.js 7:23-49
 @ ./.yarn/cache/cacheable-request-npm-7.0.2-e64cc641fc-6152813982.zip/node_modules/cacheable-request/src/index.js 19:13-28
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 26:25-53
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/decompress-response-npm-6.0.0-359de2878c-d377cf47e0.zip/node_modules/decompress-response/index.js 6:4-21
Module not found: Error: Can't resolve 'stream' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\decompress-response-npm-6.0.0-359de2878c-d377cf47e0.zip\node_modules\decompress-response'

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: { "stream": require.resolve("stream-browserify") }'
        - install 'stream-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "stream": false }
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 28:27-57
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/decompress-response-npm-6.0.0-359de2878c-d377cf47e0.zip/node_modules/decompress-response/index.js 8:13-28
Module not found: Error: Can't resolve 'zlib' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\decompress-response-npm-6.0.0-359de2878c-d377cf47e0.zip\node_modules\decompress-response'

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 }
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 28:27-57
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/get-stream-npm-5.2.0-2cfd3b452b-8bc1a23174.zip/node_modules/get-stream/buffer-stream.js 5:4-21
Module not found: Error: Can't resolve 'stream' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\get-stream-npm-5.2.0-2cfd3b452b-8bc1a23174.zip\node_modules\get-stream'

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: { "stream": require.resolve("stream-browserify") }'
        - install 'stream-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "stream": false }
 @ ./.yarn/cache/get-stream-npm-5.2.0-2cfd3b452b-8bc1a23174.zip/node_modules/get-stream/index.js 9:21-47
 @ ./.yarn/cache/cacheable-request-npm-7.0.2-e64cc641fc-6152813982.zip/node_modules/cacheable-request/src/index.js 9:18-39
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 26:25-53
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/get-stream-npm-5.2.0-2cfd3b452b-8bc1a23174.zip/node_modules/get-stream/index.js 5:4-21
Module not found: Error: Can't resolve 'buffer' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\get-stream-npm-5.2.0-2cfd3b452b-8bc1a23174.zip\node_modules\get-stream'

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 }
 @ ./.yarn/cache/cacheable-request-npm-7.0.2-e64cc641fc-6152813982.zip/node_modules/cacheable-request/src/index.js 9:18-39
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 26:25-53
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/as-promise/index.js 24:17-34
Module not found: Error: Can't resolve 'events' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\got-npm-11.8.3-caf98d599b-3b6db107d9.zip\node_modules\got\dist\source\as-promise'

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: { "events": require.resolve("events/") }'
        - install 'events'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "events": false }
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 131:13-36
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 8:15-30
Module not found: Error: Can't resolve 'util' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\got-npm-11.8.3-caf98d599b-3b6db107d9.zip\node_modules\got\dist\source\core'

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: { "util": require.resolve("util/") }'
        - install 'util'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "util": false }
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 10:17-34
Module not found: Error: Can't resolve 'stream' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\got-npm-11.8.3-caf98d599b-3b6db107d9.zip\node_modules\got\dist\source\core'

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: { "stream": require.resolve("stream-browserify") }'
        - install 'stream-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "stream": false }
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 12:13-26
Module not found: Error: Can't resolve 'fs' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\got-npm-11.8.3-caf98d599b-3b6db107d9.zip\node_modules\got\dist\source\core'
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 14:14-28
Module not found: Error: Can't resolve 'url' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\got-npm-11.8.3-caf98d599b-3b6db107d9.zip\node_modules\got\dist\source\core'

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 }
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 16:13-28
Module not found: Error: Can't resolve 'http' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\got-npm-11.8.3-caf98d599b-3b6db107d9.zip\node_modules\got\dist\source\core'

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 }
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 20:14-30
Module not found: Error: Can't resolve 'https' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\got-npm-11.8.3-caf98d599b-3b6db107d9.zip\node_modules\got\dist\source\core'

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 }
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/utils/get-body-size.js 7:13-26
Module not found: Error: Can't resolve 'fs' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\got-npm-11.8.3-caf98d599b-3b6db107d9.zip\node_modules\got\dist\source\core\utils'
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 37:24-56
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/utils/get-body-size.js 9:15-30
Module not found: Error: Can't resolve 'util' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\got-npm-11.8.3-caf98d599b-3b6db107d9.zip\node_modules\got\dist\source\core\utils'

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: { "util": require.resolve("util/") }'
        - install 'util'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "util": false }
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 37:24-56
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/utils/options-to-url.js 8:14-28
Module not found: Error: Can't resolve 'url' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\got-npm-11.8.3-caf98d599b-3b6db107d9.zip\node_modules\got\dist\source\core\utils'

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 }
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 47:25-58
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/utils/timed-out.js 8:12-26
Module not found: Error: Can't resolve 'net' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\got-npm-11.8.3-caf98d599b-3b6db107d9.zip\node_modules\got\dist\source\core\utils'
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 43:20-48
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 24:14-28
Module not found: Error: Can't resolve 'url' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\got-npm-11.8.3-caf98d599b-3b6db107d9.zip\node_modules\got\dist\source'

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 }
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/http2-wrapper-npm-1.0.3-5b58ade1df-74160b862e.zip/node_modules/http2-wrapper/source/agent.js 3:21-38
Module not found: Error: Can't resolve 'events' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\http2-wrapper-npm-1.0.3-5b58ade1df-74160b862e.zip\node_modules\http2-wrapper\source'

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: { "events": require.resolve("events/") }'
        - install 'events'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "events": false }
 @ ./.yarn/cache/http2-wrapper-npm-1.0.3-5b58ade1df-74160b862e.zip/node_modules/http2-wrapper/source/index.js 5:14-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 31:21-45
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/http2-wrapper-npm-1.0.3-5b58ade1df-74160b862e.zip/node_modules/http2-wrapper/source/agent.js 5:12-26
Module not found: Error: Can't resolve 'tls' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\http2-wrapper-npm-1.0.3-5b58ade1df-74160b862e.zip\node_modules\http2-wrapper\source'
 @ ./.yarn/cache/http2-wrapper-npm-1.0.3-5b58ade1df-74160b862e.zip/node_modules/http2-wrapper/source/index.js 5:14-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 31:21-45
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/http2-wrapper-npm-1.0.3-5b58ade1df-74160b862e.zip/node_modules/http2-wrapper/source/agent.js 7:14-30
Module not found: Error: Can't resolve 'http2' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\http2-wrapper-npm-1.0.3-5b58ade1df-74160b862e.zip\node_modules\http2-wrapper\source'
 @ ./.yarn/cache/http2-wrapper-npm-1.0.3-5b58ade1df-74160b862e.zip/node_modules/http2-wrapper/source/index.js 5:14-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 31:21-45
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/http2-wrapper-npm-1.0.3-5b58ade1df-74160b862e.zip/node_modules/http2-wrapper/source/auto.js 3:13-28
Module not found: Error: Can't resolve 'http' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\http2-wrapper-npm-1.0.3-5b58ade1df-74160b862e.zip\node_modules\http2-wrapper\source'

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 }
 @ ./.yarn/cache/http2-wrapper-npm-1.0.3-5b58ade1df-74160b862e.zip/node_modules/http2-wrapper/source/index.js 11:13-30
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 31:21-45
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/http2-wrapper-npm-1.0.3-5b58ade1df-74160b862e.zip/node_modules/http2-wrapper/source/auto.js 5:14-30
Module not found: Error: Can't resolve 'https' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\http2-wrapper-npm-1.0.3-5b58ade1df-74160b862e.zip\node_modules\http2-wrapper\source'

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 }
 @ ./.yarn/cache/http2-wrapper-npm-1.0.3-5b58ade1df-74160b862e.zip/node_modules/http2-wrapper/source/index.js 11:13-30
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 31:21-45
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/http2-wrapper-npm-1.0.3-5b58ade1df-74160b862e.zip/node_modules/http2-wrapper/source/client-request.js 3:14-30
Module not found: Error: Can't resolve 'http2' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\http2-wrapper-npm-1.0.3-5b58ade1df-74160b862e.zip\node_modules\http2-wrapper\source'
 @ ./.yarn/cache/http2-wrapper-npm-1.0.3-5b58ade1df-74160b862e.zip/node_modules/http2-wrapper/source/index.js 7:22-49
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 31:21-45
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/http2-wrapper-npm-1.0.3-5b58ade1df-74160b862e.zip/node_modules/http2-wrapper/source/client-request.js 7:4-21
Module not found: Error: Can't resolve 'stream' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\http2-wrapper-npm-1.0.3-5b58ade1df-74160b862e.zip\node_modules\http2-wrapper\source'

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: { "stream": require.resolve("stream-browserify") }'
        - install 'stream-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "stream": false }
 @ ./.yarn/cache/http2-wrapper-npm-1.0.3-5b58ade1df-74160b862e.zip/node_modules/http2-wrapper/source/index.js 7:22-49
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 31:21-45
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/http2-wrapper-npm-1.0.3-5b58ade1df-74160b862e.zip/node_modules/http2-wrapper/source/incoming-message.js 5:4-21
Module not found: Error: Can't resolve 'stream' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\http2-wrapper-npm-1.0.3-5b58ade1df-74160b862e.zip\node_modules\http2-wrapper\source'

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: { "stream": require.resolve("stream-browserify") }'
        - install 'stream-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "stream": false }
 @ ./.yarn/cache/http2-wrapper-npm-1.0.3-5b58ade1df-74160b862e.zip/node_modules/http2-wrapper/source/index.js 9:24-53
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 31:21-45
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/http2-wrapper-npm-1.0.3-5b58ade1df-74160b862e.zip/node_modules/http2-wrapper/source/index.js 3:14-30
Module not found: Error: Can't resolve 'http2' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\http2-wrapper-npm-1.0.3-5b58ade1df-74160b862e.zip\node_modules\http2-wrapper\source'
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 31:21-45
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/http2-wrapper-npm-1.0.3-5b58ade1df-74160b862e.zip/node_modules/http2-wrapper/source/utils/calculate-server-name.js 3:12-26
Module not found: Error: Can't resolve 'net' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\http2-wrapper-npm-1.0.3-5b58ade1df-74160b862e.zip\node_modules\http2-wrapper\source\utils'
 @ ./.yarn/cache/http2-wrapper-npm-1.0.3-5b58ade1df-74160b862e.zip/node_modules/http2-wrapper/source/auto.js 13:28-68
 @ ./.yarn/cache/http2-wrapper-npm-1.0.3-5b58ade1df-74160b862e.zip/node_modules/http2-wrapper/source/index.js 11:13-30
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 31:21-45
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/keyv-npm-4.2.2-d1668ef518-1d03674145.zip/node_modules/keyv/src/index.js 3:21-38
Module not found: Error: Can't resolve 'events' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\keyv-npm-4.2.2-d1668ef518-1d03674145.zip\node_modules\keyv\src'

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: { "events": require.resolve("events/") }'
        - install 'events'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "events": false }
 @ ./.yarn/cache/cacheable-request-npm-7.0.2-e64cc641fc-6152813982.zip/node_modules/cacheable-request/src/index.js 19:13-28
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 26:25-53
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/resolve-alpn-npm-1.2.1-af77edd28b-f558071fcb.zip/node_modules/resolve-alpn/index.js 3:12-26
Module not found: Error: Can't resolve 'tls' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\resolve-alpn-npm-1.2.1-af77edd28b-f558071fcb.zip\node_modules\resolve-alpn'
 @ ./.yarn/cache/http2-wrapper-npm-1.0.3-5b58ade1df-74160b862e.zip/node_modules/http2-wrapper/source/auto.js 7:20-43
 @ ./.yarn/cache/http2-wrapper-npm-1.0.3-5b58ade1df-74160b862e.zip/node_modules/http2-wrapper/source/index.js 11:13-30
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 31:21-45
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

ERROR in ./.yarn/cache/responselike-npm-2.0.0-7813864e97-6a4d32c37d.zip/node_modules/responselike/src/index.js 3:17-43
Module not found: Error: Can't resolve 'stream' in 'I:\workspace\yarn-berry\react-notion-x-cra-test\.yarn\cache\responselike-npm-2.0.0-7813864e97-6a4d32c37d.zip\node_modules\responselike\src'

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: { "stream": require.resolve("stream-browserify") }'
        - install 'stream-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "stream": false }
 @ ./.yarn/cache/cacheable-request-npm-7.0.2-e64cc641fc-6152813982.zip/node_modules/cacheable-request/src/index.js 13:17-40
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/core/index.js 26:25-53
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/create.js 31:15-32
 @ ./.yarn/cache/got-npm-11.8.3-caf98d599b-3b6db107d9.zip/node_modules/got/dist/source/index.js 26:17-36 129:13-32
 @ ./.yarn/cache/notion-client-npm-6.9.3-6.10.0-alpha.0.0-198f91c74c-f11afd8771.zip/node_modules/notion-client/build/index.js 22:0-20 361:11-17
 @ ./src/App.tsx 7:0-42 11:21-30
 @ ./src/index.tsx 7:0-24 12:33-36

38 errors have detailed information that is not shown.
Use 'stats.errorDetails: true' resp. '--stats-error-details' to show it.

webpack 5.72.0 compiled with 38 errors and 1 warning in 149 ms
No issues found.
transitive-bullshit commented 2 years ago

CRA expects you to create a separate server using something like koa or fastify. This is where you'll fetch the notion information on the backend.

All of the CRA react code runs in the browser, and notion-client is not meant to be used client-side.

See https://create-react-app.dev/docs/integrating-with-an-api-backend/

Note: CRA is imho pretty poorly maintained at this point. I would highly recommend against using it. Here's a list of other modern web app frameworks that are generally better options: https://transitivebullsh.it/javascript-dev-tools-in-2022#f2dc15819a65412a978bcfdb5c2ae13e