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 %}