React.js прохождение пути в качестве реквизита

Question

Я пытаюсь передать значение пути в папку с изображениями как свойство в React.js.Вот как я это делаю:

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';

function importAll(r) {
    let images = [];
    r.keys().map((item, index) => { images[item.replace('./', '')] = r(item); });
    return images;
}

class CoverGallery extends React.Component {
   
    constructor(props) {
        super(props);
    }

    renderImgs() {
        console.log(this.props.location);
        const images = importAll(require.context(this.props.location, false, /\.(png|jpe?g|svg)$/));      
        console.log(images);
        let imagearray = [];
        for(var key in images) {            
            imagearray.push(<img key={key} className="galery" src={images[key]} alt="Description of the universe" ></img>);
        }
        return <div>{imagearray}</div>
    }

    render() {

        return (
            <div className="photo-gallery">
                {this.renderImgs()}
            </div>
        )
    }
}

class Blog extends React.Component {
    render() {
        return (
            <CoverGallery location="../pictures/"/>
        )
    }
}

ReactDOM.render(
    <Blog />,
     document.getElementById('root')
);

Если я заменю this.props.location на "../pictures/" в renderImgs (), все будет работать нормально.

В чем причина такого поведения и как преодолеть эту проблему?

Спасибо!

РЕДАКТИРОВАТЬ: я пытаюсь сделать слайд-шоу изображений с использованием всех изображений вконкретное местоположение папки.Старый добрый "import x from y" не подходит, потому что я не знаю точного количества изображений заранее.

Поэтому я использую Webpack для этого.Как обойти требование Webpack, чтобы заранее знать точное местоположение папки?