@jmlweb/tsconfig-react 1.0.3 → 1.0.5

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @jmlweb/tsconfig-react
 
+## 1.0.5
+
+### Patch Changes
+
+- 4a9ece1: Update documentation to use pnpm commands instead of npm
+- Updated dependencies [4a9ece1]
+  - @jmlweb/tsconfig-base@1.0.4
+
+## 1.0.4
+
+### Patch Changes
+
+- 6b73301: Add changelog section with link to CHANGELOG.md in package READMEs
+- Updated dependencies [6b73301]
+  - @jmlweb/tsconfig-base@1.0.3
+
 ## 1.0.3
 
 ### Patch Changes

package/README.md

@@ -20,9 +20,11 @@
 ## 📦 Installation
 
 ```bash
-npm install --save-dev @jmlweb/tsconfig-react typescript @jmlweb/tsconfig-base
+pnpm add -D @jmlweb/tsconfig-react typescript @jmlweb/tsconfig-base
 ```
 
+> 💡 **Upgrading from a previous version?** See the [Migration Guide](#-migration-guide) for breaking changes and upgrade instructions.
+
 ## 🚀 Quick Start
 
 Create a `tsconfig.json` file in your project root:
@@ -97,6 +99,38 @@ Create a `tsconfig.json` file in your project root:
 }
 ```
 
+## 🤔 Why Use This?
+
+> **Philosophy**: React development should leverage modern JSX transforms and bundler optimizations for the best developer experience and runtime performance.
+
+This package provides a TypeScript configuration specifically optimized for React library and application development. It extends the strict base configuration while adding React-specific settings that work seamlessly with modern build tools and the latest React features.
+
+### Design Decisions
+
+**Modern JSX Transform (`jsx: "react-jsx"`)**: Uses the new JSX runtime from React 17+
+
+- **Why**: Eliminates the need to import React in every file, reduces bundle size, and improves build performance. The automatic JSX runtime is the recommended approach for all modern React projects
+- **Trade-off**: Requires React 17+ (which is several years old at this point). Older projects need to upgrade
+- **When to override**: Only if you're stuck on React 16 or need the classic `React.createElement` transform for legacy compatibility
+
+**Bundler Module Resolution (`moduleResolution: "bundler"`)**: Optimized for modern build tools
+
+- **Why**: Modern bundlers like Vite, Webpack 5+, and esbuild benefit from bundler resolution, which enables better tree-shaking and handles modern module features. This matches how your build tool actually resolves modules
+- **Trade-off**: Not suitable for direct Node.js execution without a build step. But React projects always use bundlers anyway
+- **When to override**: Never for React libraries - this is the optimal choice. Use `@jmlweb/tsconfig-node` for Node.js projects instead
+
+**DOM Type Definitions (`lib: ["ES2022", "DOM", "DOM.Iterable"]`)**: Includes browser APIs
+
+- **Why**: React components interact with the DOM. Including DOM types prevents type errors when using `window`, `document`, event handlers, and other browser APIs that are fundamental to React development
+- **Trade-off**: Includes types you won't use in server-side code. But React Server Components and SSR still need DOM types for shared components
+- **When to override**: For purely server-side React code (rare). But even Next.js server components often need DOM types for shared code
+
+**ESNext Modules (`module: "ESNext"`)**: Modern module syntax for optimal bundling
+
+- **Why**: Bundlers work best with ESNext modules. They can perform advanced optimizations like scope hoisting and dead code elimination. Your bundler transpiles to the target environment anyway
+- **Trade-off**: Can't run the TypeScript output directly in Node.js without a bundler. But React projects always use bundlers
+- **When to override**: Never for React projects - let your bundler handle the final module format
+
 ## 📋 Configuration Details
 
 ### What's Included
@@ -239,9 +273,35 @@ See real-world usage examples:
 
 ## 🔗 Related Packages
 
+### Internal Packages
+
 - [`@jmlweb/tsconfig-base`](../tsconfig-base) - Base TypeScript configuration (extended by this package)
 - [`@jmlweb/eslint-config-react`](../eslint-config-react) - ESLint configuration for React libraries
 - [`@jmlweb/prettier-config-base`](../prettier-config-base) - Prettier config for consistent formatting
+- [`@jmlweb/vite-config`](../vite-config) - Vite configuration for React projects
+
+### External Tools
+
+- [TypeScript](https://www.typescriptlang.org/) - Strongly typed programming language that builds on JavaScript
+- [React](https://react.dev/) - JavaScript library for building user interfaces
+- [Vite](https://vite.dev/) - Build tool with first-class TypeScript support
+- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react) - Official React plugin for Vite
+
+## 🔄 Migration Guide
+
+### Upgrading to a New Version
+
+> **Note:** If no breaking changes were introduced in a version, it's safe to upgrade without additional steps.
+
+**No breaking changes have been introduced yet.** This package follows semantic versioning. When breaking changes are introduced, detailed migration instructions will be provided here.
+
+For version history, see the [Changelog](./CHANGELOG.md).
+
+**Need Help?** If you encounter issues during migration, please [open an issue](https://github.com/jmlweb/tooling/issues/new).
+
+## 📜 Changelog
+
+See [CHANGELOG.md](./CHANGELOG.md) for version history and release notes.
 
 ## 📄 License
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jmlweb/tsconfig-react",
-  "version": "1.0.3",
+  "version": "1.0.5",
   "description": "TypeScript configuration for React libraries with JSX support and modern defaults",
   "main": "tsconfig.json",
   "exports": {
@@ -35,7 +35,7 @@
     "access": "public"
   },
   "peerDependencies": {
-    "@jmlweb/tsconfig-base": "1.0.2"
+    "@jmlweb/tsconfig-base": "1.0.4"
   },
   "scripts": {}
 }