huggingface / huggingface/doc-builder
Issue Running Svelte Locally: IconCopyLink is not defined + Unexpected Line Number in Error Stack
- Dominant language
- Python
- Stars
- 144
- Forks
- 59
- Avg merge
- 2d 5h
- Merged PRs (30d)
- 13
Description
> Can we tweak the success message to something else, like "You got it right!", from "You got all the answers!". The current wording might sound like the user has completed everything, which could be a bit misleading in this context. Updating it would help make the feedback clearer and avoid any confusion. See the image
>
> 
_Originally posted by @recluzegeek in [#484](https://github.com/huggingface/agents-course/issues/484#issuecomment-2891532265)_
I'm currently working on improving the success message logic as discussed in [#484](https://github.com/huggingface/agents-course/issues/484#issuecomment-2891532265). Specifically, I’ve updated `kit/src/lib/Questions.svelte` to show different feedback messages depending on whether the question has a single correct answer or multiple correct answers.
Now I’m trying to run the Svelte app locally to test these changes, but I'm running into issues. I've followed the instructions [here](https://github.com/huggingface/doc-builder/tree/c9160402357bd63780c53f66c6dee5be9d1c894d?tab=readme-ov-file#developing-svelte-locally)
- [x] Created `kit/src/routes/_toctree.yml` file with the recommended content
- [x] Created `kit/src/routes/index.mdx` with the provided content
- [x] Ran `npm ci` for clean installation of dependencies
However, when I try to run via `npm run dev -- --open`, I get 404 error as other people have encountered as well reported #448 #456 #502 . As some people recommended going back to older commits in those issues, I tried that approach as well. It worked in some cases only, and that depends on the content of the `kit/src/routes/index.mdx`, if that file contains simple content like without any mdx specific boilerplate and plain text, like "Hello World", it works perfectly fine, But when I type mdx specific content to the file, it throws new kind of error, and here's the full error stack
```bash
500
IconCopyLink is not defined
ReferenceError: IconCopyLink is not defined
at eval (/src/routes/index.mdx:24:311)
at Object.$$render (/home/vagrant/doc-builder/kit/node_modules/svelte/internal/index.js:1745:22)
at Object.default (root.svelte:43:47)
at eval (/src/routes/__layout.svelte:40:157)
at Object.$$render (/home/vagrant/doc-builder/kit/node_modules/svelte/internal/index.js:1745:22)
at root.svelte:37:45
at $$render (/home/vagrant/doc-builder/kit/node_modules/svelte/internal/index.js:1745:22)
at Object.render (/home/vagrant/doc-builder/kit/node_modules/svelte/internal/index.js:1753:26)
at render_response (file:///home/vagrant/doc-builder/kit/.svelte-kit/runtime/server/index.js:1166:28)
at process.processTicksAndRejections (node:internal/process/task_queues:105:5)
```
However, I can confirm that the file exists in the `kit/src/lib/`. Here's the output of the tree command on the folder
```bash
(base) vagrant@ubuntu-jammy:~/doc-builder/kit$ tree src/lib/
src/lib/
├── Added.svelte
├── Changed.svelte
├── .
├── .
├── .
├── IconCopy.svelte
├── IconCopyLink.svelte <====
├── IconCurl.svelte
├── IconEyeHide.svelte
├── .
├── .
├── .
├── PipelineIcon.svelte
├── PipelineIcons
│ ├── IconAudioClassification.svelte
│ ├── IconAudioToAudio.svelte
│ ├── IconAutomaticSpeechRecognition.svelte
│ ├── .
│ ├── .
│ ├── .
│ ├── IconVoiceActivityDetection.svelte
│ └── IconZeroShotClassification.svelte
├── PipelineTag.svelte
├── .
├── .
├── .
├── tooltip.ts
└── types.ts
1 directory, 76 files
```
Another interesting thing to note from the error, is that it says that the error occured at ` at eval (/src/routes/index.mdx:24:311)`, however here's the content of the `kit/src/routes/index.md` file and that's only 18 lines long file, not 24 as been reported in the error. What's going on here? Also, note that `IconCopyLink` is not being referred in the `kit/src/routes/index.md` as well.
```mdx
import Tip from "$lib/Tip.svelte";
import Youtube from "$lib/Youtube.svelte";
import Docstring from "$lib/Docstring.svelte";
import CodeBlock from "$lib/CodeBlock.svelte";
import CodeBlockFw from "$lib/CodeBlockFw.svelte";
[Here](https://myurl.com)
## Some heading
And some text [Here](https://myurl.com)
Physics is the natural science that studies matter
```
Any help appreciated! Thanks.
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.