https://github.com/sidwebworks/react-ts-webpack

https://github.com/sidwebworks/react-ts-webpack

Last synced: 8 months ago
JSON representation

• Host: GitHub
• URL: https://github.com/sidwebworks/react-ts-webpack
• Owner: sidwebworks
• Created: 2022-07-13T06:44:10.000Z (almost 4 years ago)
• Default Branch: master
• Last Pushed: 2022-07-21T20:35:13.000Z (almost 4 years ago)
• Last Synced: 2025-09-29T12:40:24.679Z (9 months ago)
• Language: TypeScript
• Size: 83 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# React + Typescript

> Setup from scratch using webpack and babel

## Dev Dependencies

- Standlone Packages

  - webpack: Core library for Webpack

  - webpack-cli: Command line interface for Webpack

  - webpack-dev-server: development server for webpack allows things like Hot module replacement on changes.

  - webpack-merge: Utility for merging different webpack configurations and modifying them.

  - @babel/cli: Command line interface for babel js

  - @babel/core: Core library for babel

  - @babel/runtime: A collection of runtime helper functions used by babel for transpiling code.

- Babel Presets

  > A babel preset is a package containing a set of configuration options and plugins for a particular use case.

  - @babel/preset-env: Enables the output code to support older environments.

  - @babel/preset-react: Enables processing of JSX syntax to simpler function calls like `React.createElement`.

  - @babel/preset-typescript: Enables processing of typescript syntax to regular javascript.

- Babel plugins

  - @babel/plugin-transform-runtime: Transforms any inline references to `@babel/runtime` helpers with require/import statements.

- Webpack plugins

  - html-webpack-plugin: Creates an `index.html` in the final build directory based on a given `template.html` file.

  - terser-webpack-plugin: Minifies and compresses the output code using Terser, replaces any inline comments and much more.

- Webpack loaders

  - babel-loader: Allows preprocessing of source files using babel.

  - css-loader: Allows pre processing of `.css` files