Webpack билд в корень проекта?

Question

ich_heisse_erich @ich_heisse_erich

Webpack

Webpack билд в корень проекта?

Всем добрый вечер, можете подсказать, на данный момент сборщик webpack билдит в папку dist, могу ли я каким-то образом билдить в корень проекта, дело в том, что разработка лендингов идет уже внутри проекта, есть путь projectname/promo/landings/Тут папка с лендингом и сбилженные файлы должны находится по этому пути. В конфиге ковырялся, оставлял просто __dirname, но он отказывается билдить без какой-либо папки.

const path = require('path');
const HTMLWebpackPlugin = require('html-webpack-plugin');
const {
  CleanWebpackPlugin
} = require('clean-webpack-plugin');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const OptimizeCssAssetsWebpackPlugin = require('optimize-css-assets-webpack-plugin');
const TerserWebpackPlugin = require('terser-webpack-plugin');
const autoprefixer = require('autoprefixer');
const webpack = require('webpack');

// Определение режима сборки
const isDev = process.env.NODE_ENV === 'development'
const isProd = !isDev

// Название файлов
const filename = ext => isDev ? `css/[name].${ext}` : `css/[name].min.[hash].${ext}`

// Функция оптимизации файлов для прода

const optimization = () => {
  const config = {
    splitChunks: {
      chunks: 'all'
    }
  }
  if (isProd) {
    config.minimizer = [
      new OptimizeCssAssetsWebpackPlugin,
      new TerserWebpackPlugin
    ]
  }
  return config
}

// Подставляем загрузчик для стилей разный для дева и прода

const cssLoaders = extra => {
  const loaders = [{
      loader: MiniCssExtractPlugin.loader,
      options: {
        hmr: isDev,
        reloadAll: true,
        publicPath: '../'
      },
    },
    'css-loader',
  ]

  if (isProd) {
    loaders.push({
      loader: 'postcss-loader',
      options: {
        sourceMap: true,
        config: {
          path: 'postcss.config.js'
        }
      }
    })
  }

  if (extra) {
    loaders.push(extra)
  }

  return loaders
}

// Настройки babel
const babelOptions = preset => {
  const opts = {
    presets: [
      '@babel/preset-env'
    ],
    plugins: [
      '@babel/plugin-proposal-class-properties'
    ]
  }
  if (preset) {
    opts.presets.push(preset)
  }
  return opts
}

// Загрузчик js, подключение EsLint

const jsLoaders = () => {
  const loaders = [{
    loader: 'babel-loader',
    options: babelOptions()
  }, ]
  if (isDev) {
    loaders.push('eslint-loader')
  }
  return loaders
}


// Настройки сборки

module.exports = {
  context: path.resolve(__dirname, 'src'),
  mode: 'development',
  entry: ['@babel/polyfill', './index.js'],
  output: {
    filename: 'bundle.js',
    path: (path.resolve(__dirname, './'))
  },
  resolve: {
    extensions: ['.js', '.json', '.png'],
  },
  optimization: optimization(),
  devServer: {
    hot: isDev,
    port: 4200,
    overlay: {
      warnings: true,
      errors: true
    }
  },
  devtool: isDev ? 'source-map' : '',
  plugins: [
    new webpack.ProvidePlugin({
      $: 'jquery',
      jQuery: 'jquery',
      'window.jQuery': 'jquery'
    }),
    new HTMLWebpackPlugin({
      template: './index.html',
      minify: {
        collapseWhitespace: isProd
      }
    }),
    new CleanWebpackPlugin(),
    new CopyWebpackPlugin(
      [{
        from: path.resolve(__dirname, 'src/static'),
        to: path.resolve(__dirname, './')
      }]
    ),
    new MiniCssExtractPlugin({
      filename: filename('css')
    })
  ],
  module: {
    rules: [{
        test: /\.html$/,
        loader: 'html-loader'
      },
      {
        test: /\.js$/,
        exclude: [
          '/node_modules/',
          // path.resolve(__dirname, '../template_resources/static/js/registration.js')
        ],
        use: jsLoaders()
      },
      {
        test: /\.css$/,
        use: cssLoaders()
      },
      {
        test: /\.s[ac]ss$/,
        use: cssLoaders('sass-loader')
      },
      {
        test: /\.(png|jpg|jpeg|svg|gif)$/,
        use: [{
            loader: 'file-loader',
            options: {
              name: '[name].[ext]',
              outputPath: './img'
            }
          },
          {
            loader: 'image-webpack-loader',
            options: {
              bypassOnDebug: true,
              mozjpeg: {
                progressive: true,
                quality: 80
              },
              optipng: {
                enabled: false,
              },
              pngquant: {
                quality: [0.70, 0.90],
                speed: 4
              },
              gifsicle: {
                interlaced: false,
              },
              webp: {
                quality: 75
              }
            }
          }
        ]
      },
      {
        test: /\.(ttf|woff|woff2|eot)$/,
        use: [{
          loader: 'file-loader',
          options: {
            name: '[name].[ext]',
            outputPath: './fonts'
          }
        }]
      },
    ],
  }
}