diff --git a/README.md b/README.md index 36e16c9..b38a77c 100644 --- a/README.md +++ b/README.md @@ -1 +1,80 @@ -# webpack-es6-boilerplate \ No newline at end of file +# 🌐 Webpack ES6 Boilerplate + +Minimal webpack 5 boilerplate using Babel, Sass with a hot dev server and a production build. + +## Prerequisites + +- [Node.js](https://nodejs.org/) +- [Yarn](https://yarnpkg.com/) + +## Getting Started + +### Installation + +```bash +git clone https://github.com/Seogeurim/webpack-es6-boilerplate.git +cd webpack-es6-boilerplate +yarn install +``` + +### Development server + +Webpack dev server runs at `localhost:8000`. + +```bash +yarn run dev +``` + +### Production build + +Build outputs are created in `dist`. + +```bash +yarn run build +``` + +## Features + +- [webpack](https://webpack.js.org/) +- [Babel](https://babeljs.io/) +- [Sass](https://sass-lang.com/) + +## Dependencies + +### webpack + +- [`webpack`](https://github.com/webpack/webpack) - Module and asset bundler. +- [`webpack-cli`](https://github.com/webpack/webpack-cli) - Command line interface for webpack +- [`webpack-dev-server`](https://github.com/webpack/webpack-dev-server) - Development server for webpack +- [`webpack-merge`](https://github.com/survivejs/webpack-merge) - Simplify development/production configuration + +### Babel + +- [`@babel/core`](https://www.npmjs.com/package/@babel/core) - Transpile ES6+ to backwards compatible JavaScript +- [`@babel/preset-env`](https://babeljs.io/docs/en/babel-preset-env) - Smart preset for Babel + +### Loaders + +- [`babel-loader`](https://webpack.js.org/loaders/babel-loader/) - Transpile files with Babel and webpack +- [`sass-loader`](https://webpack.js.org/loaders/sass-loader/) - Load SCSS and compile to CSS + - [`sass`](https://github.com/sass/dart-sass) - A pure JavaScript implementation of Sass +- [`css-loader`](https://webpack.js.org/loaders/css-loader/) - Resolve CSS imports +- [`style-loader`](https://webpack.js.org/loaders/style-loader/) - Inject CSS into the DOM + +### Plugins + +- [`clean-webpack-plugin`](https://github.com/johnagan/clean-webpack-plugin) - Remove/clean build folders +- [`html-webpack-plugin`](https://github.com/jantimon/html-webpack-plugin) - Generate HTML files from template + +### Linters + +- [`eslint`](https://github.com/eslint/eslint) - Enforce styleguide across application +- [`eslint-config-airbnb-base`](https://github.com/airbnb/javascript/tree/master/packages/eslint-config-airbnb-base) - Base JS styleguide of Airbnb +- [`eslint-config-prettier`](https://github.com/prettier/eslint-config-prettier) - Implment prettier rules +- [`eslint-plugin-import`](https://github.com/benmosher/eslint-plugin-import) - Implment import rules +- [`eslint-plugin-prettier`](https://github.com/prettier/eslint-plugin-prettier) - Dependency for prettier usage with ESLint +- [`prettier`](https://github.com/prettier/prettier) - code formatter + +## License + +This project is licensed under the [MIT License](./LICENSE).