{"id":18677430,"url":"https://github.com/persteenolsen/webpack-5-react-boilerplate","last_synced_at":"2025-10-04T14:13:01.739Z","repository":{"id":108002233,"uuid":"335940860","full_name":"persteenolsen/webpack-5-react-boilerplate","owner":"persteenolsen","description":"A Webpack 5 boilerplate with Babel React and PostCSS ","archived":false,"fork":false,"pushed_at":"2025-08-30T16:52:20.000Z","size":370,"stargazers_count":6,"open_issues_count":0,"forks_count":8,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-08-30T17:32:31.782Z","etag":null,"topics":["babel","es6","postcss","react","webpack"],"latest_commit_sha":null,"homepage":"https://webpack5react.persteenolsen.com/","language":"JavaScript","has_issues":false,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/persteenolsen.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2021-02-04T12:01:20.000Z","updated_at":"2025-08-30T16:52:24.000Z","dependencies_parsed_at":null,"dependency_job_id":"b150052f-b3cb-4752-bf36-b5baf4ac6a44","html_url":"https://github.com/persteenolsen/webpack-5-react-boilerplate","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/persteenolsen/webpack-5-react-boilerplate","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/persteenolsen%2Fwebpack-5-react-boilerplate","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/persteenolsen%2Fwebpack-5-react-boilerplate/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/persteenolsen%2Fwebpack-5-react-boilerplate/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/persteenolsen%2Fwebpack-5-react-boilerplate/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/persteenolsen","download_url":"https://codeload.github.com/persteenolsen/webpack-5-react-boilerplate/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/persteenolsen%2Fwebpack-5-react-boilerplate/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":278322146,"owners_count":25967874,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-10-04T02:00:05.491Z","response_time":63,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["babel","es6","postcss","react","webpack"],"created_at":"2024-11-07T09:33:53.727Z","updated_at":"2025-10-04T14:13:01.733Z","avatar_url":"https://github.com/persteenolsen.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Webpack 5 React Boilerplate\n\nWebpack 5 boilerplate using React, Babel 7, PostCSS and Sass with a hot dev server and an optimized production build. Babel compiles ES6+ and React to ES5. \n\nLast updated: 02-09-2025\n\nNode Version: 22.15.0\n\nReact Version: 19.0.0\n\n# Usage\n\n# Installing\n\n- Make sure you have a new version of Node installed\n- Download the code by zip or fork\n- Run the command npm install by the command promt\n\n# Development server:\n\n- npm run start\n- You can view the development server at `localhost:8080`.\n\n# Production build:\n\n- npm run build\n\n# To view the build use http-server:\n\n- npm run prod\n\n\n# Features\n\n- [webpack](https://webpack.js.org/)\n- [React](https://reactjs.org/)\n- [Babel](https://babeljs.io/)\n- [Sass](https://sass-lang.com/)\n- [PostCSS](https://postcss.org/)\n\n\n# Dependencies \n\n# React\n\n- [`react`](https://www.npmjs.com/package/react) - React is a JavaScript library for creating user interfaces. For creating React components.\n- [`react-dom`](https://www.npmjs.com/package/react-dom) - This package serves as the entry point to the DOM and server renderers for React. \n- [`react-router-dom`](https://www.npmjs.com/package/react-router-dom) - This package serves as DOM for React Router. \n- [`react-hook-form`](https://www.npmjs.com/package/react-hook-form) - Forms in Reack. \n\n# Babel\n\n- [`@babel-runtime`](https://babeljs.io/docs/en/babel-runtime) - Babel Runtime for dev babel/plugin-transform-runtime.\n\n# Other \n\n- [`core-js`](https://www.npmjs.com/package/core-js) - Main Library with polyfills for older Browsers\n- [`whatwg-fetch`](https://www.npmjs.com/package/whatwg-fetch) - For making promise based web request progammitically\n\n\n#  devDependencies\n\n# webpack\n\n- [`webpack`](https://github.com/webpack/webpack) - Module and asset bundler.\n- [`webpack-cli`](https://github.com/webpack/webpack-cli) - Command line interface for webpack\n- [`webpack-dev-server`](https://github.com/webpack/webpack-dev-server) - Development server for webpack\n- [`webpack-merge`](https://github.com/survivejs/webpack-merge) - Simplify dev/prod configuration\n\n# Loaders\n\n- [`babel-loader`](https://webpack.js.org/loaders/babel-loader/) - Transpile files - Babel/webpack\n- [`sass-loader`](https://webpack.js.org/loaders/sass-loader/) - Load SCSS and compile to CSS\n- [`node-sass`](https://github.com/sass/node-sass) - Node Sass\n- [`postcss-loader`](https://webpack.js.org/loaders/postcss-loader/) - Process CSS with PostCSS\n- [`postcss-preset-env`](https://www.npmjs.com/package/postcss-preset-env) - Default for PostCSS\n- [`css-loader`](https://webpack.js.org/loaders/css-loader/) - Resolve CSS imports\n- [`style-loader`](https://webpack.js.org/loaders/style-loader/) - Inject CSS into the DOM\n\n# Babel\n\n- [`@babel/core`](https://www.npmjs.com/package/@babel/core) - Transpile ES6+ to ES5\n- [`@babel/preset-env`](https://babeljs.io/docs/en/babel-preset-env) - Smart defaults for Babel\n- [`@babel/preset-react`](https://babeljs.io/docs/en/babel-preset-react) - Defaults Babel React\n- [`@babel/plugin-transform-runtime`](https://babeljs.io/docs/en/babel-plugin-transform-runtime) - Babel to use async/await\n- [`@babel/plugin-proposal-object-rest-spread`](https://babeljs.io/docs/en/plugin-proposal-object-rest-spread) - Babel helper\n- [`@babel/plugin-transform-arrow-functions`](https://babeljs.io/docs/en/plugin-transform-arrow-functions) - For arrow functions\n- [`@babel/plugin-transform-async-to-generator`](https://babeljs.io/docs/en/plugin-transform-async-to-generator) - Generator for async/await\n- [`@babel/plugin-proposal-class-properties`](https://babeljs.io/docs/en/babel-plugin-proposal-class-properties) - Use properties on a class\n\n\n# Plugins\n\n- [`clean-webpack-plugin`](https://github.com/johnagan/clean-webpack-plugin) - Remove/clean build folders\n- [`copy-webpack-plugin`](https://github.com/webpack-contrib/copy-webpack-plugin) - Copy files to build directory\n- [`html-webpack-plugin`](https://github.com/jantimon/html-webpack-plugin) - Generate HTML files from template\n- [`mini-css-extract-plugin`](https://github.com/webpack-contrib/mini-css-extract-plugin) - Extract CSS into separate files\n- [`css-minimizer-webpack-plugin`](https://webpack.js.org/plugins/css-minimizer-webpack-plugin/) - Optimize and minimize CSS assets\n- [`cross-env`](https://github.com/kentcdodds/cross-env) - Cross platform configuration\n- [`path`](https://www.npmjs.com/package/path) - Node Path moule\n- [`http-server`](https://www.npmjs.com/package/http-server) - HTTP server for testing the produktion build by running npm run prod\n\n\n# Author\n\n- Per Olsen\n\n# License\n\nThis project is open source and available under the [MIT License](LICENSE).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpersteenolsen%2Fwebpack-5-react-boilerplate","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpersteenolsen%2Fwebpack-5-react-boilerplate","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpersteenolsen%2Fwebpack-5-react-boilerplate/lists"}