Sass plugins with Brunch and Phoenix

Phoenix Forum Questions / Help
,
1

I’m still trying to get adjusted to using brunch and I’m running into a bit of difficulty getting the modular scale plugin up and running.

I’ve installed sass-brunch and configured it as follows:

plugins: {
  sass: {
    mode: "native",
    precision: 8
  }
}

I have installed the modularscale-sass library via npm and configured it as follows

npm: {
  enabled: true,
  styles: {
    modularscale: ["modularscale-sass/stylesheets/modularscale"]
  }
}

The file path matches the .scss file listed in the source, however I get the following error when I load the page:

File to import not found or unreadable: modularscale
Parent style sheet: /Users/thomascioppettini/scalpel/scalpel/web/static/css/base/typography.scss Error: File to import not found or unreadable: modularscale
       Parent style sheet: /Users/thomascioppettini/scalpel/scalpel/web/static/css/base/typography.scss

>> @import 'modularscale';

Can anyone provide any guidance on what I’m doing wrong? I feel like I’ve followed the instructions but I have no clue as to why this is failing. Any help would be greatly appreciated.

1 Like
2

I’ve mostly dumped the horrors that are Javascript build systems, including brunch, but I do know that if you are using scss (as I do) then in the brunch scss plugin section you have to add import paths there, the npm section is for things that need to be directly exposed for front-end outputting. See the docs for the configuration of the brunch scss plugin configuration section. :slight_smile:

1 Like
3

I gave webpack a try and lost a week. so then I go back to brunch and am quickly reminded why I wanted to ditch brunch for webpack in the first place. :imp:

1 Like