{"id":15207085,"url":"https://github.com/bdmostafa/webpack-babel-boilerplate","last_synced_at":"2026-03-09T01:33:54.186Z","repository":{"id":106082763,"uuid":"288947366","full_name":"bdmostafa/webpack-babel-boilerplate","owner":"bdmostafa","description":"This is a webpack babel boilerplate. It can help you compile your next generation code to old version ES5 code easily. Just clone this repo and install npm. That's done!","archived":false,"fork":false,"pushed_at":"2020-08-20T08:42:07.000Z","size":146,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-03-06T11:27:28.851Z","etag":null,"topics":["babel-es6","babel-loader","babel-preset","babel7","babeljs","es6-modules","javascript-library","webpack","webpack-babel","webpack-boilerplate","webpack-dev-server"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"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/bdmostafa.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}},"created_at":"2020-08-20T08:16:24.000Z","updated_at":"2020-08-20T08:42:09.000Z","dependencies_parsed_at":null,"dependency_job_id":"2548d2c5-3da1-497b-9802-3bcdcc3730b7","html_url":"https://github.com/bdmostafa/webpack-babel-boilerplate","commit_stats":{"total_commits":5,"total_committers":2,"mean_commits":2.5,"dds":0.4,"last_synced_commit":"dc44976bdb44e98585d6f40af078fbc6776ca1ec"},"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/bdmostafa/webpack-babel-boilerplate","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bdmostafa%2Fwebpack-babel-boilerplate","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bdmostafa%2Fwebpack-babel-boilerplate/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bdmostafa%2Fwebpack-babel-boilerplate/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bdmostafa%2Fwebpack-babel-boilerplate/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/bdmostafa","download_url":"https://codeload.github.com/bdmostafa/webpack-babel-boilerplate/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bdmostafa%2Fwebpack-babel-boilerplate/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":30279777,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-03-08T20:45:49.896Z","status":"ssl_error","status_checked_at":"2026-03-08T20:45:49.525Z","response_time":56,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.6:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"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","babel-loader","babel-preset","babel7","babeljs","es6-modules","javascript-library","webpack","webpack-babel","webpack-boilerplate","webpack-dev-server"],"created_at":"2024-09-28T06:21:39.124Z","updated_at":"2026-03-09T01:33:53.675Z","avatar_url":"https://github.com/bdmostafa.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"Steps to create this boilerplate as like below:\n\nYou can use common js modular pattern (used by Node js internal) and ES6 modular pattern as well.\n\nSome workflow tools - webpack, gulp, grunt etc.\n\nWebpack is to fix the issues as like huge coding on one file, debugging issue, multiple scripts (single responsibility principal), multiple request handling in index.html file, bandwidth loss, slowing the application\n\nWebpack- module bundler (bundle multiple js file to single file)\nhttps://webpack.js.org/\n\nMain file - main.js/app.js/script.js (anyone)\nDependency file - UI.js, Store.js, weather.js, or any related js file (altogether)\n\nBabel - Convert the latest code into the older version code so that both of old and modern browsers can read the code and execute well\n\nJavaScript compiler - (next generation code to ES5)\nhttps://babeljs.io/\n\nHow to install webpack on project folder\nhttps://webpack.js.org/guides/getting-started/\nnpm init -y\nnpm install webpack webpack-cli --save-dev\n\nInstall babel under webpack\nhttps://webpack.js.org/loaders/\nhttps://webpack.js.org/loaders/babel-loader/\nnpm install -D babel-loader @babel/core @babel/preset-env webpack - (webpack (not needed))\n\nbabel documentation\nhttps://babeljs.io/docs/en/babel-preset-env\n@babel/preset-env is a smart preset that allows you to use the latest JavaScript without needing to micromanage which syntax transforms (and optionally, browser polyfills) are needed by your target environment(s).\nLatest code is transformed to ES5 or any old version code\n\ncreate index.html\nCreate src folder -\u003e index.js\ncreate webpack.config.js (name must be)\nUse js common modular pattern\nrequire path\n....\nwebpack generates build folder automatically\n\nMethod 1. Babel loaders - write some rules on webpack.config.js\nhttps://webpack.js.org/loaders/babel-loader/#usage\nfor multiple script js files loading and converting next generation code into ES5\n\nMethod 2. For async await converting support, use polyfill\nhttps://webpack.js.org/guides/shimming/#loading-polyfills\n\nMethod 3. For server creating use webpack dev server\nhttps://webpack.js.org/guides/development/#using-webpack-dev-server\nhttps://webpack.js.org/configuration/dev-server/#devserverpublicpath-\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbdmostafa%2Fwebpack-babel-boilerplate","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbdmostafa%2Fwebpack-babel-boilerplate","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbdmostafa%2Fwebpack-babel-boilerplate/lists"}