Skip to content

Works fine in compilation, problem with VS Code #113

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
mmanna3 opened this issue Mar 8, 2021 · 6 comments
Closed

Works fine in compilation, problem with VS Code #113

mmanna3 opened this issue Mar 8, 2021 · 6 comments
Assignees
Labels
question Further information is requested

Comments

@mmanna3
Copy link

mmanna3 commented Mar 8, 2021

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

image

image

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:
image

It's a Create React App.

Thanks in advance for any help.

@mmanna3
Copy link
Author

mmanna3 commented Mar 8, 2021

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
Copy link
Author

mmanna3 commented Mar 9, 2021

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
Copy link
Owner

mrmckeb commented Mar 10, 2021

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 :)

@mrmckeb mrmckeb self-assigned this Mar 10, 2021
@mrmckeb mrmckeb added the question Further information is requested label Mar 10, 2021
@mmanna3
Copy link
Author

mmanna3 commented Mar 10, 2021

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
Copy link
Owner

mrmckeb commented Mar 15, 2021

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
Copy link
Author

mmanna3 commented Mar 16, 2021

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.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
question Further information is requested
Projects
None yet
Development

No branches or pull requests

2 participants