पाठ 30 / 30

Quick Reference और Cheat Sheet

Config snippets और common tasks के लिए quick lookup।

Essential .babelrc configs

Common setups के लिए copy-paste configs।

// React + TypeScript, modern browsers
{
  "presets": [
    ["@babel/preset-env", { "targets": { "browsers": ["last 2 versions"] } }],
    "@babel/preset-react",
    "@babel/preset-typescript"
  ]
}

// React + TypeScript, with polyfills for older browsers
{
  "presets": [
    ["@babel/preset-env", { "useBuiltIns": "usage", "corejs": "3" }],
    "@babel/preset-react",
    "@babel/preset-typescript"
  ]
}

Essential .swcrc configs

Typical projects के लिए quick SWC setups।

// React + TypeScript (most common)
{
  "env": { "targets": { "chrome": "90" } },
  "jsc": {
    "parser": { "syntax": "typescript", "jsx": true, "tsx": true },
    "transform": { "react": { "runtime": "automatic" } }
  },
  "module": { "type": "es6" }
}

// CommonJS output for Node.js
{
  "env": { "targets": { "node": "18" } },
  "jsc": { "parser": { "syntax": "typescript" } },
  "module": { "type": "commonjs" }
}

CLI commands quick reference

सबसे common transpilation commands।

# Babel
npx babel src/index.js                    # Transpile one file
npx babel src -d dist                     # Transpile directory
npx babel src --watch                     # Watch and transpile on change
npx babel src --out-file bundle.js        # Output to single file

# SWC
npx swc src/index.js                      # Transpile one file
npx swc src -d dist                       # Transpile directory
npx swc src --watch                       # Watch mode
npx swc compile src                       # Full compile