typescript-plugin-css-modules icon indicating copy to clipboard operation
typescript-plugin-css-modules copied to clipboard

Fails to find files by aliased imports with omitted file extension or underscore

Open taletski opened this issue 3 years ago • 0 comments

First, thank you guys for a great plugin <3

Describe the bug I am experiencing issues with .scss files that use @imports with the following: import alias, omit leading underscore and omit file extension

To Reproduce

  • Next.js app in a monorepo

  • Files structure

    repo/
    ├─ apps/
    │  ├─ my-nextjs-app/
    │  │  ├─ src/
    │  │  │  ├─ styles/
    │  │  │  │  ├─ _variables.scss
    │  │  │  ├─ pages/
    │  │  │  │  ├─ index.module.scss
    │  │  │  │  ├─ index.tsx
    │  │  ├─ tsconfig.json
    ├─ tsconfig.base.json
    
  • File apps/my-app/tsconfig.json

    {
      "extends": "../../tsconfig.base.json",
      "compilerOptions": {
        "plugins": [{ "name": "typescript-plugin-css-modules"}],
        "paths": {
          "@/*": ["apps/my-app/src/*"],
        }
      }
    }
    
  • File apps/my-app/src/pages/index.module.scss imports apps/my-app/src/styles/_variables.scss in the following ways:

    • No import alias:
      1. @import 'src/styles/_variables.scss'- working ✅
      2. @import 'src/styles/variables.scss' - working ✅
      3. @import 'src/styles/_variables' - working ✅
      4. @import 'src/styles/variables' - working ✅
    • With alias:
      1. @import '@/styles/_variables.scss' - still working ✅
      2. @import '@/styles/variables.scss' - not working ❌
      3. @import '@/styles/_variables'- not working ❌
      4. @import '@/styles/variables'- not working ❌

    By not working I mean empty object types for scss module like so:

    (alias) let styles: {}
    import styles
    

Expected behavior Expect cases b.-d. or at least case d. to work.

Additional context Here is how the TS server log looks:

Info 151  [22:09:44.001] [typescript-plugin-css-modules] Failed Error: Can't find stylesheet to import.
  ╷
1 │ @import '@/styles/legacy/v2/variables';
  │         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  ╵
  src/layout/components/SideNavigation/NavigationItem/NavigationItem.module.scss 1:9  root stylesheet

Would be really glad if this is an easy fix that can be made on your side. Please, let me know if I shoud submit an issue to the sass repo instead.

taletski avatar Jun 16 '22 20:06 taletski