TS2339: Property does not exist on type 'typeof import ...'

Thanks for supporting this library, I am facing issues integrating it with less and the latest version for loaders, I tried different setups but only this managed to “work” (kinda)

I got the following setup:

package.json

{
    "@teamsupercell/typings-for-css-modules-loader": "2.0.0",
    "css-loader": "3.2.0",
    "less-loader": "5.0.0",
    "style-loader": "1.0.0",
    "ts-loader": "6.1.0",
    "typescript": "3.6.3",
    "url-loader": "2.1.0",
    "webpack": "4.40.2",
    "webpack-dev-server": "3.8.0"
  }

tsconfig.json

{
  "compilerOptions": {
    "outDir": "./dist/",
    "sourceMap": true,
    "noImplicitAny": true,
    "module": "commonjs",
    "target": "es6",
    "jsx": "react",
    "allowSyntheticDefaultImports": true,
    "typeRoots": ["node_modules/@types", "./typings"]
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules"]
}

webpack.config.js

{
        test: /\.(less)$/,
        use: [
          { loader: 'style-loader' },
          {
            loader: 'css-loader',
            options: { modules: true },
          },
          {
            loader: '@teamsupercell/typings-for-css-modules-loader',
          },
          { loader: 'less-loader', options: { sourceMap: true } },
        ],
}

less/components/logo.less

.logo {
  background-color: red;
  width: 100px;
  height: 100px;
}

After running webpack in dev it generates the logo.d.ts file that contents:

export interface ILogoLess {
    logo: string
}

export const locals: ILogoLess
export default locals

I tried importing the styles in several ways but this is the only one that “seems to work”:

import * as styles from '../../less/component/logo.less' // {logo: "_3_lAqxKX6-Al3YE3MgBx_J"}

This works on the DOM, but I get the error:

TS2339: Property 'logo' does not exist on type 'typeof import(".../less/component/logo.less")'.

I dont know how to fix this, I tried several times now

_Originally posted by @CoericK in https://github.com/TeamSupercell/typings-for-css-modules-loader/issues/7#issuecomment-531636867_

[ErikParso]

Thanks! esModuleInterop flag with combination of import styles from './styles.css'; helps. Looking forward to fix.

[Obi-Dann]

@ErikParso @CoericK started #14 which should resolve this issue. ETA is about 1 or 2 days. Thanks for all the information you provided and for your patience ❤️
As a workaround, you can try enabling TS compilerOptions esModuleInterop to true. TypeScript would check whether the module is esModule and either use the value from default field or just return the module. I was mistakenly thinking that that behavior is configured by allowSyntheticDefaultImports option 😞