Question: How to config it in VSCode

[xiaoxiangmoe]

It seems don't work for me.

---

Reproduce steps:

yarn create react-app  --scripts-version=react-scripts-ts@next .
mv src/App.css src/App.module.css 

then open src/App.tsx, change code import * as styles from './App.css'; to

// tslint:disable 
import styles from './App.module.css'

then add code below in images.d.ts

/* remove 
declare module '*.css'
declare module '*.scss'
declare module '*.sass'
*/
declare module '*.module.css' {
    const classes: { [key: string]: string };
    export default classes;
  }
   
  declare module '*.module.scss' {
    const classes: { [key: string]: string };
    export default classes;
  }
   
  declare module '*.module.sass' {
    const classes: { [key: string]: string };
    export default classes;
  }

then add code below in tsconfig.json

"plugins": [
      {
        "name": "typescript-plugin-css-modules",
        "options": {
          "customMatcher": "\\.module\\.(sa|sc|c)ss$"
        }
      }
    ]

no type hint for me.

[mrmckeb]

Hello @xiaoxiangmoe, good question. I am actually updating the docs this weekend because I found that issue too...

VSCode has its own TypeScript instance running - so you have two options:

1. You can add the plugin to your VSCode settings.

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

2. You can tell VSCode to run your workspace version of TypeScript.
   https://code.visualstudio.com/docs/languages/typescript#_using-the-workspace-version-of-typescript

Please let me know if this helps, and if you have any other questions or feedback.

Edit: you can also remove the options object, as the matcher that you have is the default.

[xiaoxiangmoe]

@mrmckeb I told VSCode to run your workspace version of TypeScript.

>>> cat .vscode/settings.json  
{
    "typescript.tsdk": "node_modules/typescript/lib"
}

It still don't work for me.

But I change it to "typescript.tsdk": "./node_modules/typescript/lib" then it works.

[xiaoxiangmoe]

But we prefer using default export in create-react-app, I will submit a Pull request to fix this in an hour.

[mrmckeb]

Thanks @xiaoxiangmoe, this is great. I'll release an updated version within the next 12 hours.

[mrmckeb]

This should be resolved now, thanks again for your help @xiaoxiangmoe. Please try the new version and let me know if you have any more issues.

[xiaoxiangmoe]

@mrmckeb Thank you, it works now. But it won't work in monorepo mode(yarn workspace) if I run my workspace version of TypeScript. Maybe I should open an new Issue