title: How to fix these errors while installing chakra-ui and react app?
body: <p><strong>How to resolve these errors while installing chakra-ui and react app?</strong></p>
  <pre><code>**user@user:~/Desktop/Projects$ npx create-react-app my-app --template @chakra-ui**
  [Error][1]
  
  Creating a new React app in /home/user/Desktop/Projects/my-app.
  
  Installing packages. This might take a couple of minutes.
  Installing react, react-dom, and react-scripts with @chakra-ui/cra-template...
  
  
  added 1935 packages, and audited 1936 packages in 2m
  
  125 packages are looking for funding
    run `npm fund` for details
  
  found 0 vulnerabilities
  
  Initialized a git repository.
  
  Installing template dependencies using npm...
  npm WARN ERESOLVE overriding peer dependency
  npm WARN Found: react@17.0.1
  npm WARN node_modules/react
  npm WARN   peer react@&quot;17.0.1&quot; from react-dom@17.0.1
  npm WARN   node_modules/react-dom
  npm WARN     react-dom@&quot;^17.0.1&quot; from the root project
  npm WARN     4 more (framer-motion, @testing-library/react, ...)
  npm WARN   54 more (the root project, @chakra-ui/react, @emotion/react, ...)
  npm WARN 
  npm WARN Could not resolve dependency:
  npm WARN peer react@&quot;^16.8.0&quot; from react-remove-scroll@2.4.0
  npm WARN node_modules/react-remove-scroll
  npm WARN   react-remove-scroll@&quot;2.4.0&quot; from @chakra-ui/modal@1.4.3
  npm WARN   node_modules/@chakra-ui/modal
  npm WARN ERESOLVE overriding peer dependency
  npm WARN Found: react@17.0.1
  npm WARN node_modules/react
  npm WARN   peer react@&quot;17.0.1&quot; from react-dom@17.0.1
  npm WARN   node_modules/react-dom
  npm WARN     react-dom@&quot;^17.0.1&quot; from the root project
  npm WARN     4 more (framer-motion, @testing-library/react, ...)
  npm WARN   54 more (the root project, @chakra-ui/react, @emotion/react, ...)
  npm WARN 
  npm WARN Could not resolve dependency:
  npm WARN peer react@&quot;^16.8.0&quot; from react-focus-lock@2.4.1
  npm WARN node_modules/react-focus-lock
  npm WARN   react-focus-lock@&quot;2.4.1&quot; from @chakra-ui/focus-lock@1.0.3
  npm WARN   node_modules/@chakra-ui/focus-lock
  npm WARN ERESOLVE overriding peer dependency
  npm WARN Found: react@17.0.1
  npm WARN node_modules/react
  npm WARN   peer react@&quot;17.0.1&quot; from react-dom@17.0.1
  npm WARN   node_modules/react-dom
  npm WARN     react-dom@&quot;^17.0.1&quot; from the root project
  npm WARN     4 more (framer-motion, @testing-library/react, ...)
  npm WARN   54 more (the root project, @chakra-ui/react, @emotion/react, ...)
  npm WARN 
  npm WARN Could not resolve dependency:
  npm WARN peer react@&quot;^16.8.0&quot; from @reach/alert@0.11.0
  npm WARN node_modules/@reach/alert
  npm WARN   @reach/alert@&quot;0.11.0&quot; from @chakra-ui/toast@1.1.5
  npm WARN   node_modules/@chakra-ui/toast
  npm WARN ERESOLVE overriding peer dependency
  npm WARN Found: react-dom@17.0.1
  npm WARN node_modules/react-dom
  npm WARN   react-dom@&quot;^17.0.1&quot; from the root project
  npm WARN   4 more (framer-motion, @testing-library/react, ...)
  npm WARN 
  npm WARN Could not resolve dependency:
  npm WARN peer react-dom@&quot;^16.8.0&quot; from @reach/alert@0.11.0
  npm WARN node_modules/@reach/alert
  npm WARN   @reach/alert@&quot;0.11.0&quot; from @chakra-ui/toast@1.1.5
  npm WARN   node_modules/@chakra-ui/toast
  npm ERR! code ERESOLVE
  npm ERR! ERESOLVE unable to resolve dependency tree
  npm ERR! 
  npm ERR! Found: react@17.0.1
  npm ERR! node_modules/react
  npm ERR!   peer react@&quot;17.0.1&quot; from react-dom@17.0.1
  npm ERR!   node_modules/react-dom
  npm ERR!     react-dom@&quot;^17.0.1&quot; from the root project
  npm ERR!     peer react-dom@&quot;&gt;=16.8&quot; from framer-motion@3.2.1
  npm ERR!     node_modules/framer-motion
  npm ERR!       framer-motion@&quot;&gt;=3.0.0&quot; from the root project
  npm ERR!       8 more (@chakra-ui/react, @chakra-ui/checkbox, ...)
  npm ERR!     3 more (@testing-library/react, @chakra-ui/portal, @chakra-ui/toast)
  npm ERR!   react@&quot;^17.0.1&quot; from the root project
  npm ERR!   53 more (@chakra-ui/react, @emotion/react, @emotion/styled, ...)
  npm ERR! 
  npm ERR! Could not resolve dependency:
  npm ERR! peer react@&quot;^16.8.0&quot; from @reach/utils@0.11.0
  npm ERR! node_modules/@reach/alert/node_modules/@reach/utils
  npm ERR!   @reach/utils@&quot;0.11.0&quot; from @reach/alert@0.11.0
  npm ERR!   node_modules/@reach/alert
  npm ERR!     @reach/alert@&quot;0.11.0&quot; from @chakra-ui/toast@1.1.5
  npm ERR!     node_modules/@chakra-ui/toast
  npm ERR!       @chakra-ui/toast@&quot;1.1.5&quot; from @chakra-ui/react@1.1.4
  npm ERR!       node_modules/@chakra-ui/react
  npm ERR! 
  npm ERR! Fix the upstream dependency conflict, or retry
  npm ERR! this command with --force, or --legacy-peer-deps
  npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
  npm ERR! 
  npm ERR! See /home/user/.npm/eresolve-report.txt for a full report.
  
  npm ERR! A complete log of this run can be found in:
  npm ERR!     /home/user/.npm/_logs/2021-01-17T07_29_38_104Z-debug.log
  `npm install --save @chakra-ui/react@^1.0.0 @emotion/react@^11.0.0 @emotion/styled@^11.0.0 react-icons@^3.0.0 framer-motion@&gt;=3.0.0 @testing-library/jest-dom@^5.9.0 @testing-library/react@^10.2.1 @testing-library/user-event@^12.0.2 web-vitals@^0.2.2` failed
  </code></pre>
  <p>how to fix it?</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;blockquote class="imgur-embed-pub" lang="en" data-id="a/M0Rpz86" data-context="false" &gt;&lt;a href="//imgur.com/a/M0Rpz86"&gt;&lt;/a&gt;&lt;/blockquote&gt;&lt;script async src="//s.imgur.com/min/embed.js" charset="utf-8"&gt;&lt;/script&gt;</code></pre>
  </div>
  </div>
  </p>