Repository navigation
webpack 5 + Vue + TS-Loader how to use generics? #1620
Description
I tried to use generics with webpack and while I have no problems in my current Vite project I have no clue how to make it working with webpack.
I always receive TS2304: Cannot find name 'T'.
For example
<script setup lang="ts" generic="T extends string">
interface Props {
modelValue: T;
}
const props = defineProps<Props>();
</script>
<template>{{ modelValue }}</template>Is there a way to enable generics with this TS Loader and webpack 5? I created a minimal repo here
https://codesandbox.io/p/sandbox/webpack-vue-3-forked-p67wfr?welcome=true
Expected Behaviour
- Vue generics should work
Actual Behaviour
- Vue generics won't work -> see error above
Steps to Reproduce the Problem
- create a Vue component and try to use generics with webpack
Location of a Minimal Repository that Demonstrates the Issue.
https://codesandbox.io/p/sandbox/webpack-vue-3-forked-p67wfr?welcome=true
Activity
Anubarak commentedon Nov 10, 2023
So I guess this is not possible?
kamilwylegala commentedon Dec 30, 2024
@Anubarak I stumbled upon the same problem. I decided to give a try to rspack. And it helped. Migration was really straight forward (documentation is really helpful).
Requirements for it was only having
vue-loader> v17.2.0. Also addingvue-tscis required, since rspack only transpiles typescript. But just installing it helped, I have errors highlighted in IDE (phpstorm).My build is reduced from 12sec to 3sec and generics support in Vue's single file component works now.