https://github.com/glook/webpack-typescript-react

Webpack 5 boilerplate with support of most common loaders and modules (see tags and description)
https://github.com/glook/webpack-typescript-react

babel boilerplate boilerplate-template css-modules eslint less postcss prettier prettier-import-sort react sass svgr typescript webpack webpack-boilerplate webpack-configuration webpack-dev-server webpack-starter webpack5

Last synced: 6 days ago
JSON representation

Webpack 5 boilerplate with support of most common loaders and modules (see tags and description)

• Host: GitHub
• URL: https://github.com/glook/webpack-typescript-react
• Owner: glook
• License: mit
• Created: 2019-06-10T12:51:45.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2022-06-29T03:21:17.000Z (over 2 years ago)
• Last Synced: 2024-12-08T03:42:03.302Z (16 days ago)
• Topics: babel, boilerplate, boilerplate-template, css-modules, eslint, less, postcss, prettier, prettier-import-sort, react, sass, svgr, typescript, webpack, webpack-boilerplate, webpack-configuration, webpack-dev-server, webpack-starter, webpack5
• Language: JavaScript
• Homepage:
• Size: 192 KB
• Stars: 218
• Watchers: 9
• Forks: 54
• Open Issues: 6
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Webpack 5 boilerplate

![](https://habrastorage.org/webt/q-/lv/b0/q-lvb0d4li7cpi-hsctistlzooi.png)

[Webpack 5](https://webpack.js.org/) boilerplate with support of most common loaders and modules:

-   [babel](https://babeljs.io/)

-   typescript (using [ForkTsCheckerWebpack](https://www.npmjs.com/package/fork-ts-checker-webpack-plugin) )

-   sass, less, [css modules](https://github.com/css-modules/css-modules) with automatic typescript declaration

-   with react support (also with [react-refresh](https://www.npmjs.com/package/@pmmmwh/react-refresh-webpack-plugin))

-   [esLint](https://www.npmjs.com/package/eslint)

-   [prettier](https://www.npmjs.com/package/prettier) (with import sorting using [prettier-plugin-import-sort](https://www.npmjs.com/package/prettier-plugin-import-sort), [import-sort-style-module-and-prefix](https://www.npmjs.com/package/import-sort-style-module-and-prefix))

-   [webpack dev server](https://webpack.js.org/configuration/dev-server/) ([proxy](https://webpack.js.org/configuration/dev-server/#devserverproxy) support is also available)

-   importing svg as react components using [@svgr/webpack](https://www.npmjs.com/package/@svgr/webpack)

-   postcss loader (with [autoprefixer](https://www.npmjs.com/package/autoprefixer) and [cssnano](https://www.npmjs.com/package/cssnano))

-   [husky](https://www.npmjs.com/package/husky) prehooks and [lint-staged](https://www.npmjs.com/package/lint-staged)

## Quick start

To run this locally:

1. run `git clone https://github.com/glook/webpack-typescript-react.git sample-project`

2. Install all dependencies using `yarn` or `npm install`

3. Start the development server using `yarn start` or `npm run start`

4. Open up [http://localhost:8080](http://localhost:8080)