Works fine in compilation, problem with VS Code

[mmanna3]

The code compiles OK, but in VS Code the plugin doesn't seem to be working.

As Microsoft docs said, I add the line
"typescript.tsdk": "node_modules\\typescript\\lib"
in my workspace settings. Also I tried "the alternative usage" adding this

{
  "typescript.tsserver.pluginPaths": ["typescript-plugin-css-modules"]
}

to global settings.

I know that I am using the Workspace Typescript Version:

It's a Create React App.

Thanks in advance for any help.

[mmanna3]

Also, I tried downgrading the package to version 3.1.0, but the same is still happening. I also tried creating a custom.d.ts file, but I had no luck. What am I missing?

[mmanna3]

I couldn't find a way to make it work. So, I uninstalled and I went for this VS Code plugin: https://github.com/clinyong/vscode-css-modules. It doesn't have error highlighting neither error in compilation time, but at least it autocompletes. Sorry for linking to another repo, but maybe it helps someone. Thanks anyway.

[mrmckeb]

Hi @mmanna3, this works with Create React App today - we use that project for testing.

If you could share a reproduction in a git repo, I can take a look at it and help to solve :)

[mmanna3]

Hi!

This is the repo:
https://github.com/mmanna3/BlueServant/tree/typescript-plugin-css-modules

I created a branch named "typescript-plugin-css-modules" and each one of the three last commits are for configuration.

The code is in the "Frontend" folder.

Thanks a lot!

[mrmckeb]

Hi @mmanna3, that helped a lot! It looks like this issue is related to #24.

Basically, we don't have default support for baseUrl, as it's not supported by default in Sass. You just need to change to the below in your tsconfig.json and that should be all :)

"plugins": [
  {
    "name": "typescript-plugin-css-modules",
    "options": {
      "rendererOptions": {
        "sass": {
          "includePaths": ["src"]
        }
      }
    }
  }
],

As I understand this is confusing, it might make sense to do this by default for Sass, with an opt-out flag. What are your thoughts?

[mmanna3]

It works! Thank you!

Yes, I think it would be great if at least this information was in the readme. If it was the default behaviour for Sass, even better.