npm vs yarn vs pnpm में अंतर

npm install react
yarn add react
pnpm add react
# all three fetch the same package from the npm registry

⚠️ Run this in your own terminal or Node.js environment.

Task          npm            yarn        pnpm
Install all   npm install    yarn        pnpm install
Add package   npm install x  yarn add x  pnpm add x
Run a script  npm run dev    yarn dev    pnpm dev

⚠️ Run this in your own terminal or Node.js environment.

<!DOCTYPE html>
<html>
<head>
  <script src="https://unpkg.com/react@18/umd/react.development.js"></script>
  <script src="https://unpkg.com/react-dom@18/umd/react-dom.development.js"></script>
  <script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
</head>
<body>
  <div id="root"></div>
  <script type="text/babel">
function DiskSpaceDemo() {
  return (
    <div>
      <p style={{background: '#e57373', width: '260px', padding: '8px', color: '#fff'}}>
        npm/yarn: full copy of react in every project
      </p>
      <p style={{background: '#81c784', width: '90px', padding: '8px', color: '#fff'}}>
        pnpm: linked
      </p>
    </div>
  );
}
ReactDOM.createRoot(document.getElementById('root')).render(<DiskSpaceDemo />);
  </script>
</body>
</html>