@gage
Для сборки bundle.min.js с помощью webpack, вам необходимо выполнить следующие шаги:
- Установите webpack и необходимые лоадеры:
1
2
|
npm install webpack webpack-cli --save-dev
npm install babel-loader @babel/core @babel/preset-env --save-dev
|
- Создайте конфигурационный файл webpack.config.js с указанием точки входа и выходного файла bundle.min.js:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
|
const path = require('path');
module.exports = {
entry: './src/index.js',
output: {
path: path.resolve(__dirname, 'dist'),
filename: 'bundle.min.js'
},
module: {
rules: [
{
test: /.js$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader',
options: {
presets: ['@babel/preset-env']
}
}
}
]
}
};
|
- Создайте файл index.js в папке src, который будет являться точкой входа для сборки. В этом файле можно импортировать другие модули и использовать современный синтаксис JavaScript.
- Добавьте скрипт сборки в ваш package.json:
1
2
3
|
"scripts": {
"build": "webpack --config webpack.config.js"
}
|
- Запустите команду сборки:
После выполнения этих шагов, webpack соберет все необходимые модули и зависимости в файл bundle.min.js, который будет находиться в папке dist.