EliotPu / webpack-boilerplate

A webpack 5 boilerplate for building web apps (SPA/MPA) with Babel, CSS Modules

Webpack boilerplate

Important!

For correct build via Webpack you must have:

• nodejs >=16.13.1
• npm >= 7.10.0

Tech stack

• Javascript
• HTML
• CSS
• ES6
• Babel
• eslint
• CSS Modules
• Markdown

To start project:

First you need to install the dependencies:

• npm install - install the required dependencies.

Then, for start project in production mode

• npm run start - build the project in "production" mode and run "static-server".

Or, for start project in development mode

• npm run develop - run "WebpackDevServer".

Note: Versions required by the project are specified in package.json in the engines field

To build project:

npm run build:prod build the project in "production" mode ('./dist/' output folder). npm run build:dev build the project in "development" mode ('./dist/' output folder).

To run server (static):

npm run static-server - run "static-server".

To run linter:

npm run lint - run 'eslint'. npm run lint:fix run 'eslint' with fixes.

Clean up distribution:

npm run clean - run 'rimraf' (delete folder dist).

Babel:

Babel documentation.

Eslint:

Eslint documentation.

Css Modules:

See documentation and topics below:

• CSS Modules documentation.
• CSS Modules variablies.
• CSS Modules: Welcome to the Future.
• Practical Guide to React and CSS Modules.

Author

Eliot Purouski [e-mail]

• GitHub
• Linkedin