React v17 New JSX Transform

In this video, we can learn
How to use JSX without importing React
How to configure babel to support the new JSX transform.
How to remove unused imports with update-react-imports script.

React 17 doesn’t contain new features. But this would be one of the interesting topic.

Babel configuration settings
-----------------------------------------------
If you are using @babel/plugin-transform-react-jsx:
# for npm users
npm update @babel/core @babel/plugin-transform-react-jsx
// If you're using @babel/plugin-transform-react-jsx
{
"plugins": [
["@babel/plugin-transform-react-jsx", {
"runtime": "automatic"
}]
]
}

If you are using @babel/preset-react:
# for npm users
npm update @babel/core @babel/preset-react
// If you are using @babel/preset-react
{
"presets": [
["@babel/preset-react", {
"runtime": "automatic"
}]
]
}

To run the unused imports when we upgrade from react v16 to v17 use:
cd your_project
npx react-codemod update-react-imports

Please like, share and subscribe if you found the video useful.

Checkout the Playlists:

? FrontEnd JavaScript Interview Questions: https://www.youtube.com/watch?v=lU4VkJKIc8k&list=PL20fyMtMStyEK2gggQurRKZMpbwgiMh-1
? JavaScript Tutorials:
https://www.youtube.com/watch?v=5OMsWQlVPK4&list=PL20fyMtMStyGeJ3K2BMe82FryL9GRtJUp
? Essentials for Web developers:
https://www.youtube.com/watch?v=9uGuG2L08W0&list=PL20fyMtMStyGltl7wjgwSoKM_PmhB6J1v
? React Hooks & Latest concepts:
https://www.youtube.com/watch?v=jzrY8fG7HoI&list=PL20fyMtMStyHljqkLevCP0nowvhPWqcnI
? HTML Tutorials:
https://www.youtube.com/watch?v=Oo95K98h2XI&list=PL20fyMtMStyEfmaTSPKUt3HK9ZXl33cih
? CSS Tutorials:
https://www.youtube.com/watch?v=k84RK49Fz_M&list=PL20fyMtMStyGYbdFzXlM35c8B9Pv0V9pC
? Coding Challenges:
https://www.youtube.com/watch?v=3KamWwpod6E&list=PL20fyMtMStyEAoWrzWyItwqf16k_NDh-V
? Best Practices & Common mistakes:
https://www.youtube.com/watch?v=Qtrl0OEzvMo&list=PL20fyMtMStyHL0uMGRLACViz8-04mhxcC
? React js for Beginners:
https://www.youtube.com/watch?v=SkevBJhRV4M&list=PL20fyMtMStyFsrTQAjqc4QpkpCqrR3qN1
? Things To Know As JavaScript/FrontEnd Developer:
https://www.youtube.com/watch?v=hstzbtTkxog&list=PL20fyMtMStyEHs51GZR4LRJ5idC6HwWMG

LIKE | SHARE | SUBSCRIBE ?
#javascript #reactjs #react #webdevelopment #frontenddevelopment #uidevelopment
#javascriptinterviewquestions #interviewquestions #codingchallenges

???
Follow me on
Telegram: https://t.me/+HTxs0I-Jvu75RxWM
Instagram: https://www.instagram.com/rethinkingui/
Twitter: https://twitter.com/suresh9058
LinkedIn: https://www.linkedin.com/in/suresh-mende-a1a20459/