Can't @import bootstrap-sass

[jedwards1211]

I'm not sure if I'm doing wrong but the advice I followed in the readme doesn't seem to be working.

webpack.config.js:

  module: {
    ...
    {
      test: /\.s[ac]ss/,
      loader: 'style-loader!css-loader!sass-loader?outputStyle=expanded&' +
        "includePaths[]=" +
          (path.resolve(__dirname, "./node_modules"))
    }
    ...
  },

My main sass file:

@import "theme.sass";
@import "~bootstrap-sass/assets/stylesheets/_bootstrap.scss";

Is there a way I can see inside the black box how the ~ is interpreted, using a debugger or something?

node_modules/bootstrap-sass/assets/stylesheets/_bootstrap.scss definitely exists in my project and I have been able to require() it. But I get the following error when I try to @import it:

ERROR in ./~/css-loader!./~/sass-loader?outputStyle=expanded&includePaths[]=/home/andy/jcore-portal/frontend-react/node_modules!./src/styles/jCoreReactApp.sass
Module build failed: file to import not found or unreadable: ~bootstrap-sass/assets/stylesheets/_bootstrap.scss
Current dir:  (2:9)
 @ ./src/styles/jCoreReactApp.sass 4:14-328 12:19-333

[jhnns]

Probably caused by #73

[mmahalwy]

Any solution on this?

[jhnns]

Does v1.0.2 fix this issue?

[mmahalwy]

Yeah I think so - after updating my modules things started to work again. I am good.

[jhnns]

I'm glad I could help 😀