question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Cannot import that has same name props on the page file

See original GitHub issue

Describe the bug Error has occured if you tried import that has same name props in the page file.

e.g. src/routes/index.svelte

<script context="module">
  import { hello } from '$lib/test'; // <- this import
</script>

<script>
  export let hello = '';
</script>

<h1>Hello {hello}</h1>

src/lib/test.js

export const hello = 'svelte';

Logs

❯ pnpm dev

> ~TODO~@0.0.1 dev D:\Dev\trainings\sveltekit-test3
> svelte-kit dev

(node:18392) ExperimentalWarning: The ESM module loader is experimental.

  SvelteKit v1.0.0-next.80

  network: not exposed
  local:   http://localhost:3000
  network: not exposed

  Use --host to expose server to other devices on this network


1:31:15 [vite] Error when evaluating SSR module /src/lib/components/Child.svelte:
SyntaxError: Unexpected token '.'
    at new Function (<anonymous>)
    at instantiateModule (D:\Dev\trainings\sveltekit-test3\node_modules\.pnpm\vite@2.1.5\node_modules\vite\dist\node\chunks\dep-66eb515d.js:69030:9)
Unexpected token '.'
SyntaxError: Unexpected token '.'
    at new Function (<anonymous>)
    at instantiateModule (D:\Dev\trainings\sveltekit-test3\node_modules\.pnpm\vite@2.1.5\node_modules\vite\dist\node\chunks\dep-66eb515d.js:69030:9)

To Reproduce

  1. Create new SvelteKit project.
  2. Fix src/routes/index.svelte and create src/lib/test.ts like above.
  3. pnpm dev

reproduction repo -> https://github.com/ssssota/sveltekit-module-import-issue

This repo includes some samples.

Expected behavior

We will be able to import like above. And browser shows Hello svelte.

Stacktraces No stacktraces.

Information about your SvelteKit Installation:

Diagnostics

System: OS: Windows 10 10.0.19042 CPU: (12) x64 AMD Ryzen 5 2600 Six-Core Processor Memory: 5.08 GB / 15.93 GB Binaries: Node: 12.19.0 - C:\Program Files\nodejs\node.EXE npm: 7.9.0 - C:\Program Files\nodejs\npm.CMD Browsers: Chrome: 89.0.4389.114 Edge: Spartan (44.19041.906.0), Chromium (89.0.774.77) Internet Explorer: 11.0.19041.1 npmPackages: @sveltejs/adapter-node: next => 1.0.0-next.15 @sveltejs/kit: next => 1.0.0-next.80 svelte: ^3.29.0 => 3.37.0 vite: ^2.1.0 => 2.1.5

Severity

  1. Severe - I can’t read the cause from the logs.
  2. Normal - We should be able to import that.

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Comments:7 (3 by maintainers)

github_iconTop GitHub Comments

1reaction
babichjacobcommented, Apr 18, 2021

Severe - I can’t read the cause from the logs.

There is an error outside of the code sample given. I’ll close this issue and you can open a new one that includes a reproduction repository for this.

Since this might be a Vite issue, though, try reproducing with the Vite Svelte template (npm init @vitejs/app) and make the issue with them if it still happens there.

0reactions
ssssotacommented, Aug 15, 2021

I’ve confirmed that this issue has already been resolved.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Page not rendering in ReactJS - javascript - Stack Overflow
You have imported Products from another file and have an prop with the same name, maybe that's the problem. Try renaming the import...
Read more >
How passing props to component works in React
Master how to pass props (properties) to components in React with this useful beginner's guide, including demo code.
Read more >
Troubleshooting | React Navigation
Troubleshooting. This section attempts to outline issues that users frequently encounter when first getting accustomed to using React Navigation.
Read more >
FAQs - styled-components
You have several applications that are using styled-components running on the same page (e.g., several entry points in webpack are loaded on the...
Read more >
Customize your build - MSBuild - Microsoft Learn
props file (and Microsoft.Common.targets looks for Directory.Build.targets). If it finds one, it imports the file and reads the properties ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found