Practical lesson pz-3-3 WEB

In this lesson students should create template for app with webpack module builder

Acceptance criteria

• Create two different webpack configuration for production and development environment
• Create two npm script for different environment
• Instal and configure babel-loader, file-loader, html-loader, image-webpack-loader, sass-loader, to-string-loader, ts-loader, url-loader
• Instal and configure MiniCssExtractPlugin, HtmlWebpackPlugin, webpack.DefinePlugin for dev config
• Instal and configure TerserPlugin, HtmlWebpackPlugin, webpack.DefinePlugin for production config
• Add minimize option for production config

Directory Structure

├── app
│   ├── index.ts
│   └──  index.html 
├──.editorconfig
├──.gitignore
├──tsconfig.json
├──webpack.config.js
├──webpack.production.config.js
├──README.md
├──package.json
├──package-lock.json
└── 

Useful links

• учебник по JavaScript.
• javascript.ru webpack.
• A mostly complete guide to webpack.
• webpack concepts.
• Getting started with React.
• Модули JavaScript.