How to add `includePaths` to Sass loader with Webpacker

Question

I overrode the sass-loader configuration to include the node_modules path:

// config/webpack/environment.js

const { environment } = require('@rails/webpacker')

environment.loaders.prepend('sass', {
    test: /\.(css|scss|sass)$/,
    use: [{
        loader: 'style-loader'
    }, {
        loader: 'css-loader'
    }, {
        loader: 'sass-loader',
        options: {
            includePaths: ['node_modules'],
        }
    }]
})

module.exports = environment

Webpack compiles without errors, however it does not output an application.css pack anymore.

I made the change, because NPM plugins I imported from my Sass files who imported code from other plugins were causing errors when compiling.

Answer 1

Found the solution:

environment.loaders.get('sass').use.find(item => item.loader === 'sass-loader').options.includePaths = ['node_modules']

Reference: https://github.com/rails/webpacker/blob/3-x-stable/docs/webpack.md