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

error TS4058 error about CarouselConfig #400

Open
JohnMica opened this issue Oct 9, 2024 · 1 comment
Open

error TS4058 error about CarouselConfig #400

JohnMica opened this issue Oct 9, 2024 · 1 comment

Comments

@JohnMica
Copy link

JohnMica commented Oct 9, 2024

Describe the bug
A clear and concise description of what the bug is.

Using Vue3 and the latest 0.3.4 version of the vue3-carousel i import the component and the slider and then simply pass props to it.

In dev mode all works as expected, but when building with ts check it errors out with the message

src/components/ui/CarouselComp.vue:320:10 - error TS4058: Return type of exported function has or is using name 'CarouselConfig' from external module "C:/Code/vue-modules/node_modules/vue3-carousel/dist/carousel" but cannot be named.

To Reproduce
Steps to reproduce the behavior:

import the carousel in Vue3 component

import { Carousel as SliderComp, Slide as SlideComp } from 'vue3-carousel';
import 'vue3-carousel/dist/carousel.css';

the template contains the

  <SliderComp
      v-model="currentSlide"
      :snap-align="snapAlign"
      :items-to-show="itemsToShow"
      :breakpoints="breakpoints"
      :wrap-around="wrapAround"
      ref="carouselRef"
      :id="uniqueId('carousel-')"
      @slide-end="updateCurrentIndex"
    >
      <template #slides>
        <SlideComp
          v-for="(slider, ind) in results"
          :key="ind"
        >
          <div class="flex h-full flex-col items-stretch justify-start gap-2 pr-2 w-full">
            <div
              class="wm-bg--base wm-text--base grow text-center font-normal shadow hover:shadow-lg"
            >
              <slot
                :slider="slider"
                name="slider"
              />
            </div>
          </div>
        </SlideComp>
      </template>
    </SliderComp>

the slider slot is names to that i can easily access the props when using the vue component

Expected behavior

i would expect the build and ts-check to actually work

Screenshots

image

Desktop (please complete the following information):

  • OS: windows
  • Browser Brave
  • Version Version 1.70.123 Chromium: 129.0.6668.89

Smartphone (please complete the following information):

n/a

Additional context

build script

 "build": "run-p type-check \"build-only {@}\" --",

typescript related

 "vue-tsc": "2.1.6",
  "typescript": "~5.6.3",
 "vite-plugin-dts": "4.2.3",
  "vite-tsconfig-paths": "^5.0.1",
  "npm-run-all2": "6.2.3", 
  "@vue/tsconfig": "0.5.1",
  "@vue/eslint-config-typescript": "14.0.0",
  "vue": "3.5.11",
@JohnMica
Copy link
Author

JohnMica commented Oct 9, 2024

Vue build can succeed by not checking the build with tsc but thought i would through this out here

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

No branches or pull requests

2 participants