Serving static assets in webpack dev server

webpack webpack-dev-server
Rem picture Rem · Jan 19, 2016 · Viewed 72.5k times · Source

I run webpack-dev-server from the root folder of my project. I have assets folder in /src/assets that is copied by CopyWebPackPlugin:

new CopyWebpackPlugin([ { from: 'src/assets', to: 'assets' } ])

If I put logo.png inside assets folder then After running webpack-dev-server I can't access http://localhost/assets/logo.png file, but can access http://localhost/src/assets/logo.png file. However if I run in production mode the situation turns upside down.

How to configure webpack server to make http://localhost/assets/logo.png file accessible in development mode?

Answer

Katana24 picture Katana24 · Oct 14, 2016

I would add that it was the opposite for me. I originally had my images and .obj/.mtl files in a public folder that existed at the root of my application. I moved them into an assets folder that was created in the app folder.

Performing an npm install --save-dev copy-webpack-plugin and adding the 

new CopyWebpackPlugin([ { from: 'src/assets', to: 'assets' } ])

to the webpack.common.js file fixed my problem.

Related questions

How to make the webpack dev server run on port 80 and on 0.0.0.0 to make it publicly accessible?

I am new to the whole nodejs/reactjs world so apologies if my question sounds silly. So I am playing around with reactabular.js. Whenever I do a npm start it always runs on localhost:8080. How do I change it …

Read More
I am getting an "Invalid Host header" message when connecting to webpack-dev-server remotely

I am using as an environment, a Cloud9.io ubuntu VM Online IDE and I have reduced by troubleshooting this error to just running the app with Webpack dev server. I launch it with: webpack-dev-server -d --watch --history-api-fallback --host $IP …

Read More
Webpack how to build production code and how to use it

I am very new to webpack, I found that in production build we can able to reduce the size of overall code. Currently webpack builds around 8MB files and main.js around 5MB. How to reduce the size of code …

Read More