Search code examples
javascriptweb-componentes6-modulessveltecustom-element

Svelte web components - Export a class along with the components


I started working with svelte and made a few reusable web components with it, but now I'm trying to use one of my classes that I've created as well.

main.ts:

import MinimalTableManager from './components/MinimalTableManager.svelte';
import MinimalDataTable from './components/MinimalDataTable.svelte';
import {TableSort} from './models/tableSort';

Both elements are working just fine when I test them in my html:

<script type="module">
    import * as tm from '/build/bundle.js'; 
    ...
</script>

And my main problem is that I'd like to use my TableSort class in the code as well, but right now I can't import it:

import {TableSort} from '/build/bundle.js'; 
...
Uncaught SyntaxError: The requested module '/build/bundle.js' does not provide an export named 'TableSort'

rollup.config.js:

...
input: 'src/main.ts',
output: {
    sourcemap: true,
    format: 'iife',
    name: 'app',
    file: 'public/build/bundle.js'
}
...

It's definitely a rookie mistake, but right now I have no idea how I should approach it correctly.


Solution

  • Thanks to @Daniel_Knights I changed my output format in rollup.config.js from iife to es and now it works just fine.