cancel
Showing results for 
Search instead for 
Did you mean: 
Read only

Bootstrap 4 and SASS support for frontend.

Former Member
0 Kudos
763

Hello everyone,

we're working together with an external agency to implement a hybris commerce 6.5 project. The agency will provide us the HTML, including JS and CSS.

However they are using Bootstrap 4 and provide the CSS as SASS. Does anyone know what it implies, changing the current bootstrap version (3.3.7) to Bootstrap 4 and exchanging LESS with SASS in the build processes. Are there any related articles or guidelines? Thanks for all the help!

Best regards, Simon

Accepted Solutions (0)

Answers (2)

Answers (2)

Former Member
0 Kudos

My Suggestion would be to remove Hybris OOTB LESS and replace it with SASS from the agency. The agency would know how to compile the SASS code - ask them to supply the build script or have a look at grunt tasks and grunt plugins(libsass).

Former Member
0 Kudos

Hi Simon,

Did you manage to find an answer? We are in a similar situation here. Hybris OOTB uses the less framework as you know. Migration of SASS to LESS is tedious and a route we are not opting. Our idea is to incorporate the SASS files in the build process by compiling them using the sass plugin provided by node. And probably add that css file in the styles tag.

Another option is to compile them into a file named 'customsass.less' and then import this less file into the styles.css.

I'm yet to experiment with the same. Need to ensure the sass compilation works on Windows, Mac & Linux as developers may use any OS. Will add another reply after my attempt.

Update : We were able to achieve this by using buildcallbacks. We used grunt to perform sass compilation as well as autoprefixing. Since various pages use the hybris styles, we have not completely and immediately removed the OOTB less files, hence using a hybrid approach.

We are still contemplating on removing the hybris styles completely, but since it's a tedious process, we are yet to take a call on that.

Former Member
0 Kudos

We were able to do this via grunt. We called the grunt command using the buildcall backs.

Former Member
0 Kudos

could you explain how you did it in code?