Option to define default lang for script & style tags.

[grundmanise]

Is your feature request related to a problem? Please describe.
Option to define default lang for script & style tags.
Writing lang='scss' / lang='typescript' could be tedious, it would be nice if there would be an option to define default langs so that those wouldn't have to be specified in the tags each time.

Describe the solution you'd like
Treat <script> as though it is <script lang='typescript'>, if default lang typescript for script is specified.
Treat <style> as though it is <style lang='scss'>, if default lang scss for style is specified.

How important is this feature to you?
Nice to have.

[kaisermann]

Hey @grundmanise 👋 ! I'm an advocate for explicitness, but I also understand the pain of repeatedly typing those attributes (even though it's just a few characters). However, the first problem that comes to my mind is how IDEs are supposed to know how it should highlight the scss/typescript/etc syntax.

There's also the possibility to add a force: boolean or something alike to standalone processors which would force them to always run:

{
  preprocess: [scss({ force: true }), typescript({ force: true })]
}

But again, I'm always inclined to vote for explicitness.

[grundmanise]

Hey 👋 @kaisermann! I feel you, and I'm also for explicitness. Though here, if TS is the chosen language for the project, then devs would know that it's being used instead of plain JS. On the other hand, if the product is in the transitional state JS -> TS, explicit lang annotations make much sense.

Ah yes...IDEs.. TBH I don't know on what heuristics (except obvious - file extensions) IDEs rely to derive the language. That could be a tough one.

[kaisermann]

Yeah, I think adding this could affect the DX of a project, which is something I'd rather not do. However, with that said, you can always skip the exported processor and call the typescript transformer directly in a custom preprocessor 👀 :

// rollup.config.js
import tsTransformer from 'svelte-preprocess/dist/transformers/typescript.js';
import scssTransformer from 'svelte-preprocess/dist/transformers/scss.js';

export default {
  ...,
  plugins: [
    svelte({
      preprocess: [
        {
          script({ content, filename }) {
            return tsTransformer({
              content,
              filename,
              options: {
                /* ts options */
              },
            });
          },
          style({ content, filename }) {
            return scssTransformer({
              content,
              filename,
              options: {
                /* scss options */
              },
            });
          },
        },
      ],
    }),
  ],
};