0

Hi there this is a long shot but, hope someone can help,

I am using gulp-inline-source-html (https://github.com/exuanbo/gulp-inline-source-html) & gulp-nunjucks-render (https://github.com/carlitoplatanito/gulp-nunjucks-render) plus browserSync to show the updated UI

The plugin .pipe(inlineSource(... does something, but the problem is i don't think it properly writes the file after doing css changes, as the html in the build folder is not updated. Only when I do a hard refresh the UI is updated.

gulpfile.js

pipe(nunjucksRender({
   path: njkPaths,
   ext: "",
   data: ENV_VARS,
   envOptions: {
     trimBlocks: true,
     lstripBlocks: true
   }
 }))
 .pipe(inlineSource({
     compress: false,
     saveRemote: true,
     handlers: [require("./nunjucksHandler.js")] ??
 }))

I was trying the precompile approach https://github.com/popeindustries/inline-source/issues/70#issuecomment-384548345 (comment) but got nowhere.

nunjucksHandler.js

const Nunjucks = require('nunjucks');

module.exports = function nunjucks(source, context) {
    return new Promise((resolve, reject) => {
        if (
            source.fileContent &&
            !source.content &&
            source.type == "text/css"
        ) {
        let content;
        try {
            content = Nunjucks.precompile(source.fileContent);
        } catch (err) {
            return reject(err);
        }
           // Need to expose templates for later use somehow...
           source.content = content
        }

        resolve();
    });
};

.nunjucks

<link inline href="{{ENV_PARTIALS_BASE_PATH}}/common/terms-and-conditions/index.css" 
rel="stylesheet"/>
<section>html</section>
{% somenunjucks syntax etc %}
roshambo
  • 2,624
  • 6
  • 31
  • 54

0 Answers0