/react-ts-boilerplate

A react TS boilerplate for new proyects

Primary LanguageJavaScriptMIT LicenseMIT

Webpack 5 boilerplate

Features

Webpack 5 boilerplate with support of most common loaders and modules:

  • Webpack 5
    • html template
    • imports images, fonts.
    • sass, css modules with automatic typescript declaration
    • postcss loader
    • generates source maps for development.
    • Dev and Prod config
    • Bundle analyzer
    • Suppor for enviroment variables
  • Babel
    • preset-env
    • preset react
    • babel/preset-typescript
  • React
  • Typescript support
  • Prettier
  • Webpack dev server
  • Husky prehooks for prettier format and lint with lint-staged
  • eslint config:
    • eslint:recommended
    • react-hooks/recommended
    • eslint-config-prettier
    • typescript-eslint/recommended
    • testing-library/react
    • jest-dom/recommended
  • Jest config:
    • js-dom
    • testing-library/jest-dom/extend-expect
    • indentity-obj-proxy for css modules
    • jest typehead plugin

Instalation

Click on the Use this template green button at the top - this will make a new github repo with clean commit history. Then clone it and install dependencies:

npm i

Usage

Development server

npm start

You can view the development server at localhost:8080.

Production build

npm run build:prod

Production files goes to /dist folder

Production dev

npm run build:dev

Production files goes to /dist folder

Bundler Analyzer

npm run build:perf

helps to inspect the bundle

Author

License

This project is open source and available under the MIT License.