Compile SASS and @import from node_modules

Question

I'try to compile sass to css and importing a css-file from node_modules/purecss/build/pure.css therefore my sass file look like:

@import '~purecss/build/pure.css';

and my package.json is

{
  "name": "build_test",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "build:sass": "node-sass --include-path=node_modules Private/Stylesheets/main.scss Public/Style/main.css",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "css-loader": "^0.28.9",
    "purecss": "^1.0.0"
  }
}

I've tried it with --include-path=node_modules and --include-path node_modules and --include-paths node_modules but it doesn't work?

Anybody an idea?

Answer 1

You need an importer.

For the format you're using with ~, you could use node-sass-package-importer. Then run sass with the --importer flag like this:

node-sass --importer node_modules/node-sass-package-importer/dist/cli.js source/app.sass dest/app.css

Another option without the ~ is node-sass-import. And the code is:

node-sass --importer node_modules/node-sass-import source/app.sass dest/app.css