Static GitHub Issues

[864] How to include path in sass-loader?

prev: How can I create public js and multiple components can include it
next: get vuex store without a context or a vue component

Hi guys.

I got issue and it's driving me nuts. Please help me with that.

I am trying to integrate Google's material-components-web with Nuxt and got issue with importing SCSS.

The thing is, they for some reason using this kind of path @import '@material/checkbox'; everywhere in node_modules components files, and default Nuxt Webpack settings obviously can''t resolve that. https://github.com/material-components/material-components-web#css

To fix it I need to include node_modules in Sass include path. And I can't set it to work. This kind of code is not working:

    extend (config, ctx) {
      if (ctx.isClient) {
        config.module.rules.push({
          enforce: 'pre',
          test: /\.(js|vue)$/,
          loader: 'eslint-loader',
          exclude: /(node_modules)/
        }, {
          loader: 'sass-loader',
          options: {
            includePaths: [path.resolve(__dirname, '../node_modules')]
          }
        })
      }
    }
  }
<!--cmty--><!--cmty_prevent_hook--><div align="right"><sub><em>This question is available on <a href="https://nuxtjs.cmty.io">Nuxt.js</a> community (<a href="https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c739">#c739</a>)</em></sub></div>