svelte-routing
svelte-routing copied to clipboard
Component props are broken after adding svelte-routing
Error
When running svelte-check
, after installing svelte-routing
I receive an error like the following:
====================================
Loading svelte-check in workspace: /code/application
Getting Svelte diagnostics...
/code/application/src/Welcome.svelte:29:23
Error: Type '{ prop: string; }' is not assignable to type 'IntrinsicAttributes'.
Property 'prop' does not exist on type 'IntrinsicAttributes'. (ts)
<MyComponent prop="value" />
====================================
svelte-check found 1 error, 0 warnings, and 0 hints
Repro steps
- Install Svelte template and setup Typescript
npx degit sveltejs/template example && cd example
node scripts/setupTypescript.js
yarn
- Add
src/MyComponent.svelte
with contents:
<script lang="ts">
export let prop: string = '';
</script>
<div>{prop}</div>
- Replace
src/App.svelte
with contents:
<script lang="ts">
import MyComponent from './MyComponent.svelte';
</script>
<MyComponent prop="value" />
- Run svelte-check: verify checks pass
yarn run check
- Install svelte-routing
yarn add svelte-routing
- Run svelte-check: verify checks no longer pass
yarn run check
Alternative repro:
You can clone this repo here and see the differences in running between HEAD
and HEAD~1
: https://github.com/rjschie/svelte-routing-issue-example
Proposed solutions
We can simply update the svelte2tsx
dependency to at least version 0.2.0
, but since it's only used in here for its type, and this is likely to happen again, I'd say you could keep it as latest
in package.json instead of locking to a version.
Temporary workarounds
To workaround this, in the meantime, one can install svelte2tsx
at the latest in their own application to update the declaration files.
I wonder if, instead of doing an actual import, you could do a TS reference of the svelte2tsx
library at the top?
- import 'svelte2tsx/svelte-jsx';
+ /// <reference types="svelte2tsx/svelte-jsx" />
You might have to coincide that with changing the svelte2tsx
package to being a devDependency
instead of dependency
too, but I'm not entirely sure on that.