CLI to generate a Webpack React TypeScript Project
A CLI tool to generate a simple Webpack React TypeScript project setup. This project provides a ready-to-use development environment with essential tooling like Babel, Webpack, Prettier, and TypeScript.
To create a new Webpack React TypeScript project, you can directly use npx
without installing the tool globally:
npx @gauravdalvi/webpack-react-typescript <project-name>
This will create a new folder with the specified name and initialize the project with a complete Webpack, React, and TypeScript setup.
Inside your generated project, run the following command to start the development server:
npm start
This will open your project in a browser with live reload capabilities.
To build the project for production:
npm run build
This will create a dist folder with the bundled and minified code ready for deployment.
To format your code using Prettier, run:
npm run format
To quickly create a new React component, run:
npm run create-component <component-name>
This will execute the create_component.sh script to generate a boilerplate for your component.
The generated project will have the following structure:
.
├── package.json
├── README.md
├── scripts
│ └── create_component.sh
├── src
│ ├── App.tsx
│ ├── assets
│ │ └── logo.svg
│ ├── index.css
│ ├── index.html
│ ├── index.tsx
│ └── types
│ └── declarations.d.ts
├── tsconfig.json
├── webpack.config.js
└── webpack.prod.js