Skip to content
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

Type '{ class: string; }' is not assignable to type 'DetailedHTMLProps #32

Closed
khusseini opened this issue Jun 18, 2022 · 1 comment
Closed

Comments

@khusseini
Copy link

I just cloned the project fresh and wanted to give it a spin

npm install
npm run build

I was greeted with some errors:

> my-lib@0.0.0 build
> rimraf dist && vue-tsc && vite build

src/components/ComponentB.vue:8:8 - error TS2322: Type '{ class: string; }' is not assignable to type 'DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>'.
  Property 'class' does not exist on type 'DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>'. Did you mean 'className'?

8   <div class="flex align-content-center flex-wrap counter">
         ~~~~~

src/components/ComponentA.vue:11:28 - error TS2322: Type '{ class: string; style: undefined; }' is not assignable to type 'DetailedHTMLProps<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>'.
  Property 'class' does not exist on type 'DetailedHTMLProps<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>'. Did you mean 'className'?

11     Hello {{ msg }}! <span class="icon-heart" style="color:tomato"></span>
                              ~~~~~

src/components/ComponentB.vue:9:12 - error TS2322: Type '{ class: string; }' is not assignable to type 'DetailedHTMLProps<LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>'.
  Property 'class' does not exist on type 'DetailedHTMLProps<LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>'. Did you mean 'className'?

9     <label class="flex align-items-center justify-content-center">Counter:</label>
             ~~~~~

src/components/ComponentB.vue:11:11 - error TS2322: Type '{ class: string; }' is not assignable to type 'DetailedHTMLProps<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>'.
  Property 'class' does not exist on type 'DetailedHTMLProps<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>'. Did you mean 'className'?

11     <span class="flex align-items-center justify-content-center count">{{ count }}</span>
             ~~~~~


Found 4 errors.

npm version is 8.12.1

@wuruoyun
Copy link
Owner

Thank you for reporting the issue. I updated to npm@8.12.1 and did get the same error. The issue has been fixed with README.md updated. Thanks to https://stackoverflow.com/questions/70302671/type-class-string-is-not-assignable-to-type-detailedhtmlpropshtmlattri.

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

No branches or pull requests

2 participants