janpot / gulp-htmlbuild Goto Github PK
View Code? Open in Web Editor NEWExtract content from html documents and replace by build result
Home Page: https://www.npmjs.org/package/gulp-htmlbuild
License: MIT License
Extract content from html documents and replace by build result
Home Page: https://www.npmjs.org/package/gulp-htmlbuild
License: MIT License
I see in description that it is inspired by grunt-usemin... What are differences between this plugin and gulp-usemin? Does it add anything different?
The following is left out of the build:
<script src="vendor/mathjax/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
But the following isn't:
<script src="vendor/mathjax/MathJax.js"></script>
I'll try to make a minimized test-case later
Just a heads up: It won't build the js or css files if the paths in the html start with /. Is a silent error.
Is it possible to respect comments?
Example:
<!-- htmlbuild:js -->
<!-- inject:js -->
<script src="/js-dev/default.js"></script>
<script src="/js-dev/test.js"></script>
<!-- endinject -->
<!-- endbuild -->
Convert to:
<script src="all.js"></script>
Can be?:
<!-- htmlbuild:js -->
<!-- inject:js -->
<script src="all.js"></script>
<!-- endinject -->
<!-- endbuild -->
Thanks to this we can go to development -> production and after return production -> development.
I don't know if this is the best method.
I have
<link rel="stylesheet/less" type="text/less" href="styles/nonCacheable/sprinkler.less" />
it should create
but it creates
which breaks the dynamic less.js
Can you help?
the callback expects an array and calls "map" on it. this throws an error. what do you think? change the example or the way the callback works?
I have below,
My issue is that the task HiThere NEVERS runs due to 'build' not returning. can you advise
gulp.task('build', function() {
return gulp.src(['./index.html'])
.pipe(
htmlbuild({
// build js with preprocessor
js: htmlbuild.preprocess.js(function(block) {
block.pipe(gulpSrc())
// .pipe( print () )
.pipe(jsBuild);
block.end('js/concat.js');
}),
// build css with preprocessor
css: htmlbuild.preprocess.css(function(block) {
block.pipe(gulpSrc())
.pipe(cssBuild);
block.end('css/concat.css');
}),
// build css with preprocessor
less: htmlbuild.preprocess.css(function(block) {
block.pipe(gulpSrc())
.pipe(lessBuild);
block.end('less/concat.less');
}),
// remove blocks with this target
remove: function(block) {
block.end();
},
// add a template with this target
template: function(block) {
es.readArray([
'<!--',
' processed by htmlbuild (' + block.args[0] + ')',
'-->'
].map(function(str) {
return block.indent + str;
})).pipe(block);
}
}) // htmlbuild
)
.pipe(gulp.dest('./dist'))
});
gulp.task('HiThere', ['build'], function() {
return gulp.src('./dist/js/concat.js')
.pipe(uglify({
mangle: false
}))
.pipe(gulp.dest('dist/js'))
});
Was looking around for a replacement to grunt-usemin and was directed towards your task.
I think you might have a better time taking the approach they use; a "prepare" task that grabs the files original paths, then your task that updates references.
Here's what I'm thinking:
gulp.task('dist', function () {
var sourceFiles = gulp.src(['public/scripts/**/*.js']),
htmlFiles = gulp.src(['*.html']);
sourceFiles
.pipe(htmlbuild.prepare())
.pipe(concat())
.pipe(uglify())
.pipe(rev())
.pipe(htmlbuild.update({
html: htmlFiles
}));
});
Any thoughts?
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.