Does this work using Typescript in Svelte?

[ikudosi]

I got this whole thing to work with Svelte, however, when I try to use lang="ts" in the .svelte files, I'm just getting numerous errors like an imported custom component not found etc.

I'm not sure if this is more of a Typescript config issue or something else?

[eidellev]

Hi @ikudosi I don't think this is an issue directly related to this library, but as a general rule of thumb you should probably have a separate tsconfig.json for your frontend.

I'm not very experienced with svelte, but in my react project I also ran into similar issues and it helped.

[ikudosi]

Can you kindly share your webpack config to have it load Typescript with encore? Sorry just got onto Typescript and completely overwhelmed with all this.

On Wed, Oct 26, 2022, 1:58 AM Lev Eidelman Nagar @.***> wrote:

Hi @ikudosi https://github.com/ikudosi I don't think this is an issue directly related to this library, but as a general rule of thumb you should probably have a separate tsconfig.json for your frontend.

I'm not very experienced with svelte, but in my react project I also ran into similar issues and it helped.

— Reply to this email directly, view it on GitHub https://github.com/eidellev/inertiajs-adonisjs/issues/91#issuecomment-1291541109, or unsubscribe https://github.com/notifications/unsubscribe-auth/ABMFS6KRNR5MQWN7EABX34LWFDB7NANCNFSM6AAAAAAROGKVS4 . You are receiving this because you were mentioned.Message ID: @.***>

[eidellev]

to enable typescript you simply need to add this in your encore config:

  Encore
      // ...
+     .addEntry('main', './assets/main.ts')

+     .enableTypeScriptLoader()

https://symfony.com/doc/current/frontend/encore/typescript.html

this article shows an example of setting up svelte with encore webpack https://www.twilio.com/blog/develop-a-symfony-app-using-svelte-and-webpack-encore-to-manage-your-twilio-message-history

hope this helps :-)

[ikudosi]

Thank you for pointing me in the right direction!!! Finally got it to compile properly with Adonis!

1) Added the following packages - @tsconfig/svelte, ts-loader. 2) Changed webpack.config.js to have - Encore.addEntry('app', './resources/js/app.ts').enableTypeScriptLoader(). 3) Created a tsconfig.json in my resources/js folder where my entry-point (app.ts) is also located.

// tsconfig.json { "extends": @./svelte/tsconfig.json", "include": ["/"], "exclude": ["node_modules/","public/"], "compilerOptions": { "target": "ES6", "module": "ES2022" } }

On Wed, Oct 26, 2022 at 8:47 AM Lev Eidelman Nagar @.***> wrote:

to enable typescript you simply need to add this in your encore config:

Encore // ...+ .addEntry('main', './assets/main.ts')

• .enableTypeScriptLoader()

https://symfony.com/doc/current/frontend/encore/typescript.html

this article shows an example of setting up svelte with encore webpack

https://www.twilio.com/blog/develop-a-symfony-app-using-svelte-and-webpack-encore-to-manage-your-twilio-message-history

hope this helps :-)

— Reply to this email directly, view it on GitHub https://github.com/eidellev/inertiajs-adonisjs/issues/91#issuecomment-1291981195, or unsubscribe https://github.com/notifications/unsubscribe-auth/ABMFS6P5XCGLSILLMSAOUA3WFER5FANCNFSM6AAAAAAROGKVS4 . You are receiving this because you were mentioned.Message ID: @.***>