gulp-svelte
A gulp plugin to compile Svelte templates to JavaScript
Installation
npm install --save-dev gulp-svelte
API
const gulpSvelte = require('gulp-svelte');gulpSvelte([options])
options: Object (options for Svelte compiler API and preprocess option)
Return: stream.Transform
const {dest, src, task} = require('gulp');
const gulpSvelte = require('gulp-svelte');
task('default', () => {
return src('index.html') // index.html: '<h1>Hi {{author}}.</h1>'
.pipe(gulpSvelte())
.pipe(dest('dest')); // dest/index.js: 'function create_main_fragment ( state, component ) { ...'
});Note:
-
formatoption doesn't support legacy JavaScript formatsamd,iifeandumd. -
onerroroption is not supported. - If
cssoption receivesfalse, it also emits an extracted CSS as a separateVinylobject with a.cssfile extension.
const {dest, src, task} = require('gulp');
const gulpSvelte = require('gulp-svelte');
task('default', () => {
return src('source.html') // source.html: '<style>p{color:red}</style><p>Hello</p>'
.pipe(gulpSvelte({css: false}))
.pipe(dest('dest'));
// dest/source.js: '... p = createElement("p"); p.className = "svelte-16e8uch"; ...'
// dest/source.css: 'p.svelte-16e8uch{color:red}'
});options.preprocess
Type: Object
Modify contents with svelte.preprocess() passing this option to it before compiling the template.
const {dest, src, task} = require('gulp');
const gulpSvelte = require('gulp-svelte');
task('default', () => {
return src('index.html') // index.html: '<b>original</b>'
.pipe(gulpSvelte({
preprocess: {
markup({content}) {
return {code: content.replace('original', 'modified')}
}
}
}))
.pipe(dest('dest')); // dest/index.js: '... b = createElement("b");\n\t\t\tb.textContent = "modified"; ...'
});License
ISC License © 2017 - 2018 Shinnosuke Watanabe
