KleoPetroff/react-webpack-boilerplate

What's the correct path of assets?

Closed this issue · 3 comments

wayearn commented

The problem

What's the correct path of assets? When I want to add some images to assets folder, like asessts/img, and use on my websites, I failed.

Details

  1. Do run dev mode:
npm run start

  1. Add many images to /assets/img/bg.jpg

  2. Add path to sass files.

.bg{
  background:url("./img/bg.jpg") no-repeat top center;
  height: 720px;
}

OR

.bg{
  background:url("./assets/img/bg.jpg") no-repeat top center;
  height: 720px;
}

I got 404 error of my images.

khusainovk commented

Hey!
Try to do like this

KleoPetroff commented

Hi @kanlidy,

The problem was caused by file-loader. Reverting to 0.11.2, as @khusainovk stated, should fix the problem. I've already added a fix with some other small structural changes.

wayearn commented

Thanks guys.

You solved my problem.

And those images in React JSX could use following way:

Import first:

import imgObj from '../assets/images/logo.png';

In your JSX:

<img src={imgObj} width="36" height="44" alt="" />