module build failed

[harpagon210]

Hi,

I have the following error when webpack tries to build my app:

$slider-radius: $radius !default
               ^
      Undefined variable: "$radius".
      in ....../node_modules/bulma-slider/slider.sass (line 1, column 17)
 @ ../node_modules/bulma-slider/slider.sass 4:14-92

Any idea of what is wrong?
Do I have to import another module?

[Wikiki]

Hi @harpagon210,

did you import Bulma first ?
If yes, you have to import bulma first or use bulma-slider.sass file instead of slider.sass

rehgards

[harpagon210]

Hi thanks for your quick reply ;)

Yes, here is my imports:

import 'bulma'
import 'bulma-slider'

and my webpack-config

{
        test: /\.scss$/,
        use: [{
            loader: "style-loader" // translates CSS into CommonJS
        },{
            loader: "css-loader" // translates CSS into CommonJS
        }, {
            loader: "sass-loader" // compiles Sass to CSS
        }]
      },
      {
        test: /\.sass$/,
        use: [{
            loader: "style-loader" // translates CSS into CommonJS
        },{
            loader: "css-loader" // translates CSS into CommonJS
        }, {
            loader: "sass-loader" // compiles Sass to CSS
        }]
      },

thanks

[harpagon210]

@Wikiki there is no bulma-slider.sass in the node-modules/bulma-slider folder ;)

I installed it via

npm install bulma-slider

[Wikiki]

Weird.

Can you try with this:

@import 'bulma/sass/utilities/_all'
@import 'bulma-slider'
@import 'bulma'

[harpagon210]

@Wikiki I have the same error :(
I import via my javascript code, is that a problem? (I'm not used to webpack yet so I might be importing the files the wrong way...)

my js file:

import 'bulma/sass/utilities/_all.sass'
import 'bulma-slider/slider.sass'
import 'bulma/css/bulma.css'

[Wikiki]

You need to create a sass file in which you import files:

@import '~/bulma'
@import '~/bulma-slider'

you can't import sass (or css) files into JS.

[harpagon210]

Thanks for your answer, what I did to fix the problem is that I created a sass file like you said.
I was supposed to be able to load css files through webpack in my js but nevermind, I have to learn more about webpack I guess as I'm probably doing something wrong...