Forem

Cover image for React JS with Yarn 4
Prateek Wayne
Prateek Wayne

Posted on

4 1 1 2 1

React JS with Yarn 4

Yarn 4 introduces several advancements and features that enhance the developer experience. It requires Node.js 18+ and has made significant changes like not enabling Zero-Install by default and using Corepack over yarnPath.

We can use yarn 4 with react js by following these steps.
Must be Yarn 4
check yarn version
yarn -v:
yarn version

Now we will create a React Project:yarn create react-app my-app

React Project Structure

Unlike in previous version of yarn,we used to have node-modules
but yarn 4 comes with Plug'n'Play and Zero-Installs.
it contains 2 new files:

  • .pnp.cjs
  • .pnp.loader.mjs

.pnp.cjs file contains info about all the package that mentioned in package.json

Plug N Play is faster than node-modules but some times due to some dependencies issue ,it might not work for some projects

With Yarn 4 we can still use node-modules
Just we have to paste this command:yarn config set nodeLinker node-modules
it will create a file name :.yarnrc.yml
which contains:
node-linker

Now doing yarn install:yarn install
will bring back node_modules folder
changes:

changes
we will find that .pnp files are deleted

Image of Datadog

The Future of AI, LLMs, and Observability on Google Cloud

Datadog sat down with Google’s Director of AI to discuss the current and future states of AI, ML, and LLMs on Google Cloud. Discover 7 key insights for technical leaders, covering everything from upskilling teams to observability best practices

Learn More

Top comments (0)

Some comments may only be visible to logged-in visitors. Sign in to view all comments.

AWS Security LIVE!

Tune in for AWS Security LIVE!

Join AWS Security LIVE! for expert insights and actionable tips to protect your organization and keep security teams prepared.

Learn More