You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
50 lines
1.7 KiB
50 lines
1.7 KiB
7 months ago
|
const path = require('path')
|
||
|
const HtmlWebpackPlugin = require('html-webpack-plugin') // Импортируем плагин
|
||
|
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
|
||
|
const {CleanWebpackPlugin} = require('clean-webpack-plugin')
|
||
|
|
||
|
module.exports = {
|
||
|
mode: 'development', // Режим сборки ('development' или 'production')
|
||
|
entry: './src/index.js', // Точка входа (исходный файл)
|
||
|
output: {
|
||
|
path: path.resolve(__dirname, 'dist'), // Папка для собранных файлов
|
||
|
filename: 'bundle.js', // Имя собранного файла,
|
||
|
clean: true
|
||
|
},
|
||
|
devServer: {
|
||
|
compress: true,
|
||
|
port: 8081,
|
||
|
open: true
|
||
|
},
|
||
|
module: {
|
||
|
rules: [
|
||
|
{
|
||
|
// регулярное выражение, которое ищет все файлы с такими расширениями
|
||
|
test: /\.(png|svg|jpg|gif|woff(2)?|eot|ttf|otf)$/,
|
||
|
type: 'asset/resource'
|
||
|
},
|
||
|
{
|
||
|
// применять это правило только к CSS-файлам
|
||
|
test: /\.css$/,
|
||
|
// при обработке этих файлов нужно использовать
|
||
|
// MiniCssExtractPlugin.loader и css-loader
|
||
|
use: [MiniCssExtractPlugin.loader, {
|
||
|
loader: 'css-loader'
|
||
|
}]
|
||
|
},
|
||
|
{
|
||
|
test: /\.html$/,
|
||
|
loader: 'html-loader'
|
||
|
}
|
||
|
]
|
||
|
},
|
||
|
plugins: [
|
||
|
new HtmlWebpackPlugin({
|
||
|
template: './src/index.html' // Путь к шаблону HTML
|
||
|
}),
|
||
|
new MiniCssExtractPlugin({
|
||
|
filename: '[name].css' // Настройка имени выходного файла CSS
|
||
|
}),
|
||
|
new CleanWebpackPlugin()
|
||
|
]
|
||
|
}
|