vuejs-templates / webpack

A full-featured Webpack + vue-loader setup with hot reload, linting, testing & css extraction.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

module not found for background image

adaksuman opened this issue · comments

commented

Hi all,

I have a custom css file which I have placed in assets/css folder. Now inside of this css file, I have referred some images which are placed inside assets/images folder. I did css loading in main.js using require. Like require('./assets/css/custom.css). It does successfully loaded but when I refer a background images in custom.css like
background: transparent url('./assets/images/home.png') 50% 50% no-repeat; it fails and says that module is not found.

Could someone please help me what is wrong with this?
I did install vue-loader, css-loader and style-loader and project is created with vue-cli.

Also along with this my custom.css file is required throughout my application. What could be best place to put in. Will it be in main.js or App.vue ?

commented

error was throwing in my console is
These relative modules were not found:

  • ./assets/images/ajax-loader1.gif in ./node_modules/css-loader/dist/cjs.js??ref--6-oneOf-3-1!./node_modules/postcss-loader/src??ref--6-oneOf-3-2!./src/assets/css/custom.css
  • ./assets/images/custom/danger.png in ./node_modules/css-loader/dist/cjs.js??ref--6-oneOf-3-1!./node_modules/postcss-loader/src??ref--6-oneOf-3-2!./src/assets/css/custom.css

Same error I have when using gull Theme -
* ../../Image/Header_Bg_1.png in ./node_modules/css-loader??ref--6-oneOf-3-1!./node_modules/postcss-loader/src??ref--6-oneOf-3-2!./src/assets/styles/css/themes/lite-purple.min.css

  • any solution ???