node_modules resolve not working with @import for SCSS about rollup-plugin-postcss HOT 5 CLOSED

Does @import "react-input-range/src/scss/index.scss"; work in regular node-sass? From what I can tell it's importing a file relative to cwd instead of the one in node_modules.

However I think you can use includePaths option to make this work:

postcss({
	use: [
		['sass', {
			includePaths: [path.resolve('node_modules')]
		}]
	]
})

from rollup-plugin-postcss.

btw in v1.3.0 you can prepend it with ~ to import from node_modules, see: https://github.com/egoist/rollup-plugin-postcss#imports

from rollup-plugin-postcss.

This is working for me!

postcss({
  modules: true,
  extensions: ['.css', '.sass', '.scss'],
  namedExports: true,
  use: [
    [
      'sass', {
        includePaths: [path.join(__dirname, 'scss')]
      }
    ]
  ]
})

from rollup-plugin-postcss.

@davidungio I also ran into this today. What worked for me was to prefix the the import with node_modules. so in my case, I had to do:

@import "node_modules/@vhx/adventurine";

rather than

@import "@vhx/adventurine";

from rollup-plugin-postcss.

I also encountered this problem. I used bili to configure includePaths

// bili.config.js
const path = require('path');

module.exports = {
  postcss: {
    use: [
      [
        'sass',
        {
          includePaths: [path.resolve('node_modules')],
        },
      ],
    ],
  },
};

but this error occurred:

$ bili

🚨(postcss) /xxx/xxx.scss:1:0: Unknown word
You tried to parse SCSS with the standard CSS parser; try again with the postcss-scss parser

🤔Is my configuration wrong?

from rollup-plugin-postcss.