How to set up relative paths in webpack?

Question

JavaScript

Hello . Please tell me, I raised the project through create react app and such a problem: I
inserted the video tag, specified the relative path to the video file in the src attribute, but it does not work. after some time found out that webpack changes the path
i.e.
the path import video from '../../img/video/mainstream.mp4'
it sees as Video /static/media/mainstream.bbae5fec.mp4
How to solve this problem ?

Answer 1

after some time found that webpack changes the path
i.e.
the path import video from '../../img/video/mainstream.mp4'
he sees as Video /static/media/mainstream.bbae5fec.mp4

Everything is correct. The path changes the corresponding loader. If you look in the project folder, you can find the build directory there . The loader copies your video into it. You need to host the build folder with a static server.
Deployment
As for defining the path to the file in the tag attribute, with webpack this is done like this:

<video src={require('../../img/video/mainstream.mp4')} />

Answer 2

I use aliases, a very handy thing. Like variables for paths