sveltejs-brunch

Compile Svelte 3 components inside Brunch projects.

• Extract the CSS into a separate file
• Support CSS & JS Sourcemaps
• Preprocessing of markup, style, script
• Define file extensions which should be compiled
• Pass any Svelte compiler option

Installation

npm install --save-dev sveltejs-brunch

By default all *.svelte.html, .svelte files are compiled, unless you use the pattern option.

Advanced usage

module.exports.plugins = {
  sveltejs: {
    // To extract the CSS into files, simply include to extractCSS option in your Brunch config like so...
    extractCSS: true,
    // To combine the sourcemaps from all components into one
    combineSourceMapCSS: true,
    // The generated combined css file
    out: './public/components.css',
    // By default, svelte, svelte.html are used.
    pattern: /\.(svelte|html)$/
    // Optionally, preprocess components with svelte.preprocess:
    // https://github.com/sveltejs/svelte#preprocessor-options
    preprocess: {
      style: ({ content }) => {
        return transformStyles(content)
      }
    },
    // Other compiler options https://github.com/sveltejs/svelte#compiler-options
    ...
  }
}

Caveats

There are some limitation regarding to sourcemaps. Svelte precompilation step does not consume sourcmaps that's the reason why your code does not point to the exact original code.