SASS/SCSS related issues

  • Changes in scss file are not always updated in preview... page refreshes don't help then, only remedy is to disable and enable preview again.

  • Copying bootstrap scss tree in project Styles in order to use and redefine bootstrap sass variables slows down performance, e.g. carrousel images don't scroll smoothly anymore. The reason is that the bootstrap styles are added twice. Workaround for deployment: delete BSS exported bootstrap/css folder, and delete corresponding link in index.html page. Drawback: does not work on preview. An option to exclude default BSS bootstrap styles would solve this.

In an attempt to solve the above mentioned 2nd issue by replacing the <head> content by a copy that excludes

<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">

it turns out that 'Replace the global head content' option in 'Page properties' does not work. My alternative <head> content is added after the original <head> content:

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
    <title>Test</title>
    <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="assets/fonts/font-awesome.min.css">
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lato">
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Ubuntu:300,400">
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Varela">
    <link rel="stylesheet" href="assets/css/scss/bootstrap-grid.compiled.css">
    <link rel="stylesheet" href="assets/css/scss/bootstrap-reboot.compiled.css">
    <link rel="stylesheet" href="assets/css/scss/bootstrap.compiled.css">
    <link rel="stylesheet" href="assets/css/styles.compiled.css">
 <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
    <title>Test</title>
    <link rel="stylesheet" href="assets/fonts/font-awesome.min.css">
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lato">
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Ubuntu:300,400">
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Varela">
    <link rel="stylesheet" href="assets/css/scss/bootstrap-grid.compiled.css">
    <link rel="stylesheet" href="assets/css/scss/bootstrap-reboot.compiled.css">
    <link rel="stylesheet" href="assets/css/scss/bootstrap.compiled.css">
    <link rel="stylesheet" href="assets/css/styles.compiled.css">
</head>

This means I don't have a solution for publishing my site on the BSS servers, since I cannot exclude this line. Any ideas anyone for a workaround?