1

I am getting the following error while importing css files in my project I created using Vue js laravel.


@import '~node_modules/bootstrap/scss/functions';
       ^
      Can't find stylesheet to import.

my webpack.mix.js:

mix.webpackConfig({
   resolve: {
       extensions: ['.js', '.vue'],
       alias: {
           '@' :__dirname + '/resources',
           '@views' :__dirname + '/resources/js/views',
           '@services' :__dirname + '/resources/js/services',
           '@images' :__dirname + '/resources/images',
           '@audio' :__dirname + '/resources/audio',
           '@store' : __dirname + '/resources/js/store',
           '@mixins': __dirname + '/resources/js/mixins',
}}

Lines like ~ node_modules / bootstrap / scss / functions do not work. I have to give the full path in my hand one by one, I could not solve the problem. I think it's about Sass loader, but I'm not sure.

bariskau
  • 267
  • 3
  • 11
  • Does this answer your question? [What does a \`~\` tilde in a CSS \`url()\` do?](https://stackoverflow.com/questions/39535760/what-does-a-tilde-in-a-css-url-do) – AlexMA Mar 23 '20 at 19:33
  • Not exactly, i want to define the path like that '@baris' : '/resource/baris' – bariskau Mar 25 '20 at 20:59
  • That's fine - you can do that with webpack aliases like you've done it, but somewhere in your app it seems you're importing something with a `~` rather than a `@`, and that's causing the error because it's not formatted right. – AlexMA Mar 25 '20 at 21:40
  • Just a thought, but have you tried adding `'.scss'` to your extensions in the `resolve` section of the config? – Philll_t Aug 18 '21 at 18:57

0 Answers0