DEV Community

loading...
Cover image for My React 17 Boilerplate (with Webpack 5, Tailwind 2)

My React 17 Boilerplate (with Webpack 5, Tailwind 2)

golangch profile image Stefan Wuthrich Updated on ・3 min read

I published my first React Boilerplate with React 17, Tailwind 2, using babel, sass, with a hot dev server and an optimized production build.
Any feedback is welcome :-)

Updated (newest first):

  • added SVGR as a webpack loader to import your SVG directly as a React Component.
  • added build-staging script. same as build but using .env.staging
  • added dotenv-webpack to handle process.env.VARS
  • added Prettier
  • added react-refresh-webpack-plugin for HMR
  • 2 PR's accepted

Github repo

Installation

git clone https://github.com/altafino/react-webpack-5-tailwind-2.git
cd react-webpack-5-tailwind-2
yarn / npm i
Enter fullscreen mode Exit fullscreen mode

Usage

Development server

yarn start / npm start
Enter fullscreen mode Exit fullscreen mode

You can view the development server at localhost:3000.
(change port in ./config/webpack.dev.js)

Production build

 yarn build / npm run build
Enter fullscreen mode Exit fullscreen mode

Features

Dependencies

webpack

Babel

Loaders

Eslint

Plugins

Cheers
Stefan - Fullstack Developer - Go/JS

Discussion (5)

pic
Editor guide
Collapse
dendihandian profile image
Dendi Handian • Edited

I mistook WP as WordPress here

Collapse
golangch profile image
Collapse
golangch profile image
Stefan Wuthrich Author
  • added dotenv-webpack to handle process.env.VARS
  • added react-refresh-webpack-plugin for HMR
Collapse
golangch profile image
Stefan Wuthrich Author

Got first PR which add Husky Lint Hook

Collapse
ujjwalkr profile image
Ujjwal Kumar

cool stuff