I am trying to incoporate a html5/boostrap theme I bought into a phoenix framework app I'm working on. The theme has regular html files (one for each page), js, css, font and images folders. I moved the theme specific js and css files to the web/static/js
and web/static/css
. I moved the third party js and css files into the respective folders under web/static/vendor/js
and web/static/vendor/css
, These files include for (css: animate.css, bootstrap.css, flaticon.css, font-awesome.css, hover.css, responsive.css, resolution-slider.css, owl.css
), (js: bootstrap.min.js, jquery.js, bxslider.js, revolution.min.js, validate.js
).
The images for the app was moved to web/static/assets/images
and the graphics can be found at web/statc/assets
. I have not made any changes to brunch-config.js.
I have managed to get app.html.eex and index.html.eex to adopt the theme. At the moment when I access localhost:4000, I see the following on the console [info] GET /css/assets/timer.png [debug] ** (Phoenix.Router.NoRouteError) no route found for GET /css/assets/timer.png (RocfDev.Router)
I tracked the timer.png resource request to the file web/statc/vendor/css/resolution-slider.css
. The css code in the file is background:url(assets/timer.png
).
timer.png is actually located in web/static/assets
. Phoenix seems to be able to serve all the images and graphics ok except timer.png.
My question is why is phoenix trying to serve timer.png
from the wrong folder.
Thanks.