vuejs-templates / webpack

A full-featured Webpack + vue-loader setup with hot reload, linting, testing & css extraction.
MIT License
9.71k stars 4.4k forks source link

When load image via binding attribute, scss error occure. #1513

Open webdeveloper0429 opened 4 years ago

webdeveloper0429 commented 4 years ago

in order to load images dynamically I used below code

<img :src="require('@/assets/' + sliderItem.src)" />

so that images are loaded correctly but in this case unexpected scss error shows.

./src/assets/sass/custom/dropdowns.scss (./node_modules/css-loader/dist/cjs.js??ref--8-oneOf-3-1!./node_modules/postcss-loader/src??ref--8-oneOf-3-2!./node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-3-3!./src/assets/sass/custom/dropdowns.scss)
Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: Undefined variable.
  ╷
4 │     height: $navbar-height;
  │             ^^^^^^^^^^^^^^
  ╵
  /usr/src/app/src/assets/sass/custom/dropdowns.scss 4:13  root stylesheet

actually scss works well without image binding(above code)

any idea?