This can happen when upgrading i18next from version "19.9.2" to  "22.5.1".

The wait option that got removed was :

export interface ReactOptions {
  /**
   * Set to true if you like to wait for loaded in every translated hoc
   * @default false
   */
  wait?: boolean;

And what is useSuspense used for ? Let's check the documentation

Wow very useful, thank you !

Actually Suspense is a React feature. It was first added for server-side lazy rendering but is also available on client-side frontends. It's used for lazy loading components. If you don't know what it is you are probably not using it. Then the default is fine since this parameter might not even affect your project.

As a side note in plugin options declaration that have default values, it's best not to declare option's parameters to the default value for two reasons:

1. It's more readable if the default options are not included. Your config then lists only non-default values and you can grasp more easily how the config differs from other peoples project. In general default values are chosen carefully and should be changed only when having a good reason to.
2. It's more maintainable. When the option is removed by the plugin/module maintainer and replaced or renamed, your config adapts automatically. This case is an example. If the coder had not written the useless `wait: false` which is anyway the default value, it would not have broke during upgrade.

The post TS2322: Type '{ wait: false; }' is not assignable to type 'ReactOptions'. appeared first on Techy Things.

Generating development JavaScript bundle failed

You must provide the URL of lib/mappings.wasm by calling SourceMapConsumer.initialize({ 'lib/mappings.wasm': ... })
before using SourceMapConsumer

File: .cache\app.js

Solution

Add

--no-experimental-fetch

like such

 

You can try to add it in package.json but this may fail sometimes if your command expect optional arguments. The full proof way is to add it to .env in the directory as package.json to add it as an environment variable like above.

The post You must provide the URL of lib/mappings.wasm by calling SourceMapConsumer.initialize ERROR #98123 WEBPACK appeared first on Techy Things.

Current versions used, along with node v18.

  "@types/react-dom": "^18.2.7",
  "@types/react": "18.0.2",

This can occur when switching from node 16 or lower to node 18 or more.

This is similar to this unanswered question https://github.com/FormidableLabs/victory/discussions/2632

Solution #1

Solution #2

npm install --save-dev @types/react@latest
npm install --save-dev @types/react-dom@latest

or

yarn add --dev @types/react@latest
yarn add --dev @types/react-dom@latest

The post TS2786: 'VictoryAxis' cannot be used as a JSX component appeared first on Techy Things.

ERROR in src/pages/todos/todos.tsx:27:16
TS2345: Argument of type 'import("C:/dev/react-scss-jest-typescript/node_modules/react-i18next/ts4.1/index").TFunction<"translation", undefined>' is not assignable to parameter of type 'import("C:/dev/react-scss-jest-typescript/node_modules/i18next/typescript/t.v4").TFunction<"translation", undefined>'.
Property '$TFunctionBrand' is missing in type 'import("C:/dev/react-scss-jest-typescript/node_modules/react-i18next/ts4.1/index").TFunction<"translation", undefined>' but required in type 'import("C:/dev/react-scss-jest-typescript/node_modules/i18next/typescript/t.v4").TFunction<"translation", undefined>'.
25 |
26 | useEffect(() => {
> 27 | fetchTodos(t).then((res) => {
| ^

package.json:

    "react-i18next": "^11.8.12",
    "i18next": "^23.10.1",
    "i18next-browser-languagedetector": "^6.1.0",
    "i18next-intervalplural-postprocessor": "^3.0.0",

Solution

    "react-i18next": "^14.1.1",
    "i18next": "^23.10.1",
    "i18next-browser-languagedetector": "^6.1.0",
    "i18next-intervalplural-postprocessor": "^3.0.0",

The post TFunction TS2345: Argument of type 'xyz' is not assignable to parameter of type appeared first on Techy Things.

ERROR in ./node_modules/https-browserify/index.js 1:11-26
Module not found: Error: Can't resolve 'http' in 'C:\dev\react-scss-jest-typescript\node_modules\https-browserify'

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 }

The post Error: Can't resolve 'http' in ...\node_modules\https-browserify appeared first on Techy Things.

Solution

Upgrade from Node 16 to Node 18

The post code: 'ERR_OSSL_EVP_UNSUPPORTED' error:0308010C:digital envelope routines::unsupported appeared first on Techy Things.

Compiled with problems:
×
ERROR in src/App.tsx:51:10
TS2786: 'Button' cannot be used as a JSX component.
 Its return type 'ReactElement<any, string | JSXElementConstructor<any>> | null' is not a valid JSX element.
 Type 'ReactElement<any, string | JSXElementConstructor<any>>' is not assignable to type 'Element'.
 Types of property 'key' are incompatible.
 Type 'Key | null' is not assignable to type 'string | null'.
 Type 'number' is not assignable to type 'string'.
 49 | <div className="App">
 50 | <header className="App-header">
 > 51 | <Button>Click Me</Button>
 | ^^^^^^
 52 | <a
 53 | className="App-link"
 54 | href="https://reactjs.org"

Error TS2786 often comes from a mismatch in @types/react.

Solution

Verify that your @types/react match with your react package version.

The post TS2786: 'Button' cannot be used as a JSX component appeared first on Techy Things.

Solution #1

$ sudo mkdir /etc/systemd/sleep.conf.d
$ cd /etc/systemd/sleep.conf.d
$ echo "[Sleep] 
AllowSuspend=no 
AllowHibernation=no 
AllowSuspendThenHibernate=no 
AllowHybridSleep=no" | sudo tee nosuspend.conf

Bad Solution

$ systemctl mask sleep.target suspend.target hibernate.target hybrid-sleep.target

Don't use this even though it's mentioned first in the documentation, it will still result in attempts to put the system on sleep and result in SSH notifications, even though the system sleep will be ignored. Use instead solution #1

The post The system will suspend now! How to stop Debian from going into suspend mode at login screen appeared first on Techy Things.

Solution

yarn add @babel/core@7.17.12

The post You gave us a visitor for the node type ClassAccessorProperty but it's not a valid type appeared first on Techy Things.

Solution

Add react-error-overlay 6.0.9 to "resolution" in package.json L

  "resolutions": {
      (...)
    "react-error-overlay": "6.0.9"
  }, 

The post React reload empty iframe cannot click anywhere appeared first on Techy Things.