Plugin to compile svelte components for bundling with esbuild.
Install both this plugin and esbuild (esbuild must be above 0.8.1).
A simple build script looks like
const esbuild = require('esbuild');
const sveltePlugin = require('esbuild-svelte');
esbuild.build({
entryPoints: ['app.js'],
bundle: true,
outfile: 'out.js',
plugins: [sveltePlugin()],
logLevel: 'info',
}).catch(() => process.exit(1))
The example
folder of this repository is a great starting off point for a "complete" project.
By default, esbuild-svelte
emits external css files from Svelte for esbuild
to process. If this isn't desired, use a configuration that turns off external css output and instead includes it in the javascript output. For example: sveltePlugin({compileOptions: {css: true}})
In order to support Typescript and other languages that require preprocessing before being fed into the Svelte compiler, simply add the preprocessor to the preprocess
option (which accepts both a single preprocessor or an array of them). The example script below is a great place to start. NOTE: This will break sourcemaps as of the current release, fixes are in progress
const sveltePreprocess = require('svelte-preprocess');
const esbuildSvelte = require('esbuild-svelte');
const esbuild = require('esbuild');
esbuild.build({
entryPoints: ['index.js'],
bundle: true,
outdir: './dist',
plugins: [esbuildSvelte({
preprocess: sveltePreprocess()
})],
}).catch(() => process.exit(1));
You can see the full API for this plugin here, which includes support for Svelte's compiler options, preprocessing API, and more.
Clone, npm install
, npm link
and it's good to go! Releases are automated (with the right permissions), just by running npm version patch|minor|major
.