Подскажите, почему так картинка в фоне?
body {
background: url('../img/aguero5.jpg') no-repeat;
}
const path = require('path');
const fs = require('fs');
const webpack = require('webpack');
const HTMLPlugin = require('html-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const OptimizeCssAssetsPlugin = require('optimize-css-assets-webpack-plugin');
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
const CopyPlugin = require('copy-webpack-plugin');
const PATHS = {
src: path.join(__dirname, './src'),
dist: path.join(__dirname, './dist')
};
const PAGES_DIR = PATHS.src;
const PAGES = fs
.readdirSync(PAGES_DIR)
.filter(fileName => fileName.endsWith('.html'));
module.exports = {
entry: `${PATHS.src}/js/`,
output: {
filename: 'js/bundle.js',
path: `${PATHS.dist}`
},
optimization: {
minimizer: [new OptimizeCssAssetsPlugin({}), new UglifyJsPlugin({})]
},
devServer: {
contentBase: `${PATHS.dist}`,
port: 4200,
overlay: {
warnings: true,
errors: true
}
},
devtool: 'cheap-module-eval-source-map',
plugins: [
new webpack.SourceMapDevToolPlugin({
filename: '[file].map'
}),
new CopyPlugin([{ from: `${PATHS.src}/img`, to: `${PATHS.dist}/img` }]),
new CleanWebpackPlugin(),
...PAGES.map(
page =>
new HTMLPlugin({
template: `${PAGES_DIR}/${page}`,
filename: `./${page}`
})
),
new MiniCssExtractPlugin({
filename: 'css/style.css'
})
],
performance: { hints: false },
module: {
rules: [
{
test: /\.scss$/,
use: [MiniCssExtractPlugin.loader, 'css-loader', 'sass-loader']
},
{
test: /\.js$/,
exclude: /node_modules/,
loader: 'babel-loader'
},
{
test: /\.(png|jpe?g|gif)$/i,
use: [
{
loader: 'file-loader',
options: {
name: '[name].[ext]',
publicPath: 'img',
outputPath: 'img',
useRelativePath: true
}
},
{
loader: 'image-webpack-loader',
options: {
mozjpeg: {
progressive: true,
quality: 65
}
}
}
]
}
]
}
};
Простой
