Skip to content

Does not generate definitions for imported stylesheets #48

Closed
@k-g-a

Description

@k-g-a

Describe the bug

Even if we could use @import statements without throwing an error about plugin's async mode (i.e. via postcss-import-sync2 plugin) - we still don't get proper typings for such files.

To Reproduce

Assuming we have:

  1. ./foo/index.css with some relative imports:
@import './A.css'
@import 'B.css'
  1. corresponding files ./foo/A.css & ./foo/B.css
  2. the following postcss.config.js:
module.exports = { plugins: [require('postcss-import-sync2')()] };
  1. and ./some.js file importing styles:
import styles from './foo/index.css'

We won't get typings for styles other than {}, because of the resolution error (from TSS_LOG):

Info NNN  [typescript-plugin-css-modules] Failed Error: Failed to find 'A.css'
in [
  C:\Git\some-project-root
]

Expected behavior

Get proper typings.

Additional context

This bug occurs because of the following reasons:

  1. postcss-import-sync2 plugin looks for sourceFile in AST statement: atRule.source.input.file (here)
  2. it's missing so the plugin falls back to options.root, which is process.cwd() (or passed option). at this point we could fix the problem by manually specifying path: [] option for postcss-import-sync2 plugin, but thats not future-proof solution involving some magical knowledge to be shared almong developers.
  3. going one step further, the atRule.source.input.file field is missing because DtsSnapshotCreator does not provide the from option to postcss.process here.

A simple one-line change (adding {from: fileName} as a second argument) fixes the problem for us, but i'm not sure if this could break some common setups.

By the way, passing the same fileName as filename option to less.render alongside with setting syncImport: true should fix #47.

I can make a PR if it's proven to be the proper fix.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions