1

Giving node-refills a try in an application build with webpack, but imports don't appear to work.

in webpack.config.js

var NodeRefills = require("node-refills");

module.exports = {
  module: {
    loaders: [
      {
        test: /\.scss$/,
        exclude: /node_modules/,
        loader: 'style!css!sass'
      }
    ]
  },

  sassLoader: {
    includePaths: NodeRefills.includePaths
  },
}

Doing the same thing with node-neat, I can import those assets like this:

in layout.scss

@import "bourbon";
@import "neat";

But in the above instance, 

@import "refills";

Causes webpack build to fail with:

File to import not found or unreadable: refills

Any hints? Thanks!

Jamie Folsom
  • 1,287
  • 2
  • 10
  • 20
  • hmm, it looks like node-refills is just a bunch of sass files. in order to get them into your sass loader and css bundle, you probs have to require node-refills in your js somewhere, not in the webpack config. Have you tried that? Perhaps require it in app.js or whatever? – 4m1r Mar 18 '16 at 17:28
  • Yeah, I think `node-neat` is the same way, but that imports fine. Thx. – Jamie Folsom Mar 24 '16 at 16:53
  • Hey @Jamie! I was just looking at this yesterday and I think there is no `@import` for this case. I think bourbon refills is just a set of patterns to copy and paste in their entirety (along with the includePath change). Compared to the neat examples all of the refills and empties examples have a lot going on. There is substantial HTML, CSS and Javascript for each one. – noisecapella Mar 25 '16 at 15:09
  • Hey @noisecapella! That makes sense. I'll be looking for opportunities to apply what I learned about react and redux. We'll see... Thanks for your reply, and hope you're well! – Jamie Folsom Mar 29 '16 at 17:33

0 Answers0