Cannot read property 'fragment' of undefined

Question

I'm trying to nest one svelte component in another svelte component.

//index.js
import Parent from './Parent.svelte';

new Parent({
  target: document.querySelector('main')
})


// Parent.svelte
<script>
  import Child from "./Child.svelte";
</script>

<p>parent component</p>
<Child />


// Child.svelte
<p>child component</p>

I expect Child.svelte to be nested in Parent.svelte, but I get this error message instead

Cannot read property 'fragment' of undefined

by the way: I´m using parcel with parcel-plugin-svelte

Answer 1

This is a known bug with parcel-svelte-plugin . The workaround for now as per github issue #55 is to disable parcel hmr :

parcel --no-hmr

Answer 2

I had a similar issue and need to change the way how react is imported

 import { React } from 'react'

need to change to

 import React from 'react'