Currently, I am utilizing Vue.js along with Typescript for my project. My intention is to incorporate the vue-datetime package. However, since this package lacks a Typescript definition file, I have taken the initiative to create a basic version myself.
To accomplish this, I have inserted an index.d.ts file into the node_modules/vue-datetime directory:
import Vue from 'vue';
declare class Datetime extends Vue { }
declare class DatetimePopup extends Vue { }
export default Datetime;
export { Datetime, DatetimePopup };
I can now import and use the package in my Vue component like this (please note that I am employing the vue-class-component package, hence the slightly different syntax).
<template>
<div>
<v-datetimepicker v-model="someproperty" class="myclass"></v-datetimepicker>
</div>
</template>
<script lang="ts">
import Vue from 'vue';
import Component from 'vue-class-component';
import { Datetime } from 'vue-datetime';
import 'vue-datetime/dist/vue-datetime.css';
Vue.component('v-datetimepicker', Datetime);
@Component({
components: { Datetime }
})
export default class MyComponent extends Vue {
}
</script>
<style>
</style>
The setup works perfectly fine. However, I do not wish to store my node_modules folder in source control. To address this, I decided to relocate the definition file to the same directory as my Vue component (are there better alternatives?). I moved the index.d.ts file, renaming it to datepicker.d.ts. Subsequently, I updated my Vue component to import the datepicker like so:
import { Datetime } from './datepicker'Uncaught Error: Cannot find module './datepicker'In my quest to resolve this issue, I have explored various avenues online without success. Do you have any suggestions on what I could attempt or where the problem might lie?