Svelte

If you're using the @vime-js/complete package inside Svelte then you'll need to do a little extra setting up. For all other packages you don't need to do anything special, compile it the same as you'd compile any other Svelte component.

There are setup instructions below for:

Rollup

In addition to your usual setup you'll need to do the following.

If you want to start an application quickly then checkout the official Svelte Rollup template.

Install

NPM
YARN
NPM
npm install svelte-preprocess node-sass @rollup/plugin-replace --save-dev
YARN
yarn add svelte-preprocess node-sass @rollup/plugin-replace -D

Configure

Extend your Rollup configuration with the following

import replace from '@rollup/plugin-replace';
import sveltePreprocess from 'svelte-preprocess';
export default {
// ...
svelte({
// ...
preprocess: sveltePreprocess()
}),
replace({ 'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV) })
}

Webpack

In addition to your usual setup you'll need to do the following.

If you want to start an application quickly then checkout the official Svelte Webpack template.

Install

NPM
YARN
NPM
npm install svelte-preprocess node-sass --save-dev
YARN
yarn add svelte-preprocess node-sass -D

Configure

Extend your Webpack configuration with the following

const sveltePreprocess = require('svelte-preprocess');
const EnvironmentPlugin = require('webpack').EnvironmentPlugin;
module.exports = {
// ...
module: {
// ...
rules: [
{
test: /\.(html|svelte)$/,
exclude: /node_modules/,
use: {
loader: 'svelte-loader',
options: {
// ...
preprocess: sveltePreprocess()
},
},
},
// ...
]
},
plugins: [
new EnvironmentPlugin({
NODE_ENV: 'development'
}),
// ...
]
}