Can this be a TypeScript plugin?

[mohsen1]

I'm not familiar with TypeScript plugins as much as you are. You wrote one but I was wondering if this can become a TypeScript plugin that extends module resolution to CSS files?

[Quramy]

It's interesting 😄

For example, vue-ts-plugin allows to treat .vue files as TypeScript sources. Using the same technique, this idea might be realised.

[Quramy]

@mohsen1 You may like https://github.com/HerringtonDarkholme/ts-css-plugin .

cc: thanks @HerringtonDarkholme !

[cameron-martin]

The docs for Language Service Plugins suggests that this wouldn't work

TypeScript Language Service Plugins ("plugins") are for changing the editing experience only. The core TypeScript language remains the same. Plugins can't add new language features such as new syntax or different typechecking behavior, and plugins aren't loaded during normal commandline typechecking or emitting.

So I have no idea how that vue one works. Will have a little dig around in the next few days and report my findings :)

[mohsen1]

GraphQL Plugin is editing only as well.

Follow this issue: https://github.com/Microsoft/TypeScript/issues/16607

[mohsen1]

Note that it's possible to have your own tsserver and tsc that does custom module resolution. By overloading resolveModuleNames it's possible to make compiler think a .css file resolve to an actual TypeScript file. This is what's happening here.

[avif]

I was looking for something similar and came across this: https://www.npmjs.com/package/ts-css-modules

There's no git repository associated with this package and I couldn't get it to work but you could look at the package content after installing it and see the approach used seems very possible.

Also, the readme instructs to install vue-ts-plugin instead of ts-css-modules.

[cameron-martin]

That was me starting to mess around with Typescript language service plugins (with the aim to create one for CSS modules). I didn't get very far though :(

[fabb]

Here‘s something similar as a PostCSS plugin: https://github.com/ezavile/postcss-typescript-css

[FDiskas]

It actually already exists npm i D typescript-plugin-css-modules

    "plugins": [
      {
        "name": "typescript-plugin-css-modules",
        "options": {
          "classnameTransform": "camelCase",
          "customMatcher": "\\.module\\.scss$"
        }
      }
    ],