'Warning: <VIEW /> is using incorrect casing. Use PascalCase for React components, or lowercase for HTML elements

console.error node_modules/react-dom/cjs/react-dom.development.js:506 Warning: is using incorrect casing. Use PascalCase for React components, or lowercase for HTML elements.

I have the issue with Jest and react-pdf

Solution 1:^[1]

In React(Native/JS) world you must name your component in PascalCase, PascalCase is a naming convention in which the first letter of each word in a compound word is capitalized. Software developers often use PascalCase when writing source code to name functions, classes, and other objects. PascalCase is similar to camelCase, except the first letter in PascalCase is always capitalized.

So you must name your components like these:

function MyFnComp(props) {
.
.
.
}

class MyClsComp extentds React.Component {
.
.
.
}

export function App(){
  return (
    <MyFnComp />
    <MyClsComp />
    {/*Using lowercase for HTML elements:*/}
    <div> This is a HTML native element! </div>
  )
}

Solution 2:^[2]

Try this, change your component physical name to View (first character upper case), then rename all of your imports to View as well, then restart your visual code, I hope it works for you

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source
Solution 1	Mamrezo
Solution 2	behzad

'Warning: <VIEW /> is using incorrect casing. Use PascalCase for React components, or lowercase for HTML elements

Solution 1:[1]

Solution 2:[2]

Sources

Related Questions

Solution 1:^[1]

Solution 2:^[2]