Cannot use together with `@csstools/postcss-sass`

[chalkygames123]

Hi.

I'm trying to use node-sass-magic-importer inside @csstools/postcss-sass, but it fails at the @import statement which depends on the former.

The following are reduced examples.

package.json

{
  "main": "index.js",
  "devDependencies": {
    "@csstools/postcss-sass": "^4.0.0",
    "node-sass-magic-importer": "^5.3.1",
    "postcss": "^7.0.14",
    "postcss-scss": "^2.0.0"
  },
  "dependencies": {
    "normalize.css": "^8.0.1"
  },
  "private": true
}

index.js

const fs = require('fs')
const postcss = require('postcss')
const postcssSass = require('@csstools/postcss-sass')

fs.readFile('input.scss', (err, css) => {
  postcss([
    postcssSass({
      importer: require('node-sass-magic-importer')()
    })
  ])
    .process(css, {
      from: 'input.scss',
      syntax: require('postcss-scss')
    })
    .then(result => {
      console.log(result.css)
    })
})

input.scss

@import '~normalize.css/normalize';

When I run $ node . I get the following error:

(node:40773) UnhandledPromiseRejectionWarning: Error: File to import not found or unreadable
  ╷
1 │ @import '~normalize.css/normalize';
  │         ^^^^^^^^^^^^^^^^^^^^^^^^^^
  ╵
  input.scss#sass 1:9  root stylesheet
...

I'm not sure it really due to node-sass-magic-importer, so I'm sorry if it's not relevant.

Thank you.

[maoberlehner]

As far as I can see postcssSass does override the importer option with its own custom importer https://github.com/jonathantneal/postcss-sass/blob/master/index.js#L30 please open an issue in the https://github.com/jonathantneal/postcss-sass project. Thx!

[chalkygames123]

Thank you for quick response! I'll address it.