VueJs сторонние компоненты
От: BlackEric http://black-eric.lj.ru
Дата: 14.05.19 15:48
Оценка:
Пытаюсь подключить сторонний компонент VueJs. A simple and sweet vue.js calendar

import Vue from 'vue';
import { Component } from 'vue-property-decorator';
import { SweetCalendar } from 'vue-sweet-calendar';
import 'vue-sweet-calendar/dist/SweetCalendar.css';

@Component({
    components: {
        SweetCalendar
    }
})
export default class CalendarComponent extends Vue {
    data() {
        return {
            eventCategories: [....

При запуске ошибка: TS7016: Could not find a declaration file for module 'vue-sweet-calendar'. 'xxx\node_modules\vue-sweet-calendar\dist\SweetCalendar.umd.min.js' implicitly has an 'any' type.

Если регистрировать как
@Component({
    components: {
        SweetCalendar: require('vue-sweet-calendar').default
    }
})

Все равно ошибка:

[Vue warn]: Unknown custom element: <sweet-calendar> — did you register the component correctly? For recursive components, make sure to provide the "name" option.

found in

---> <CalendarComponent> at ClientApp/components/calendar/calendar.vue.html


Нужен vue-sweet-calendar.d.ts? Но где его тогда брать? Для сторонних компонентов не нахожу я этих файлов.

Солюшен создавал из vuets
https://github.com/BlackEric001
Re: VueJs сторонние компоненты
От: BlackEric http://black-eric.lj.ru
Дата: 15.05.19 08:07
Оценка:
Получилось подключить через генерацию d.ts файла.

1. Устанавливаем npm install -g dts-gen
2. Выполняем

d:\>npm install -g vue-sweet-calendar
+ vue-sweet-calendar@0.2.7
added 3 packages from 2 contributors in 2.289s

d:\>dts-gen -m vue-sweet-calendar
Wrote 52 lines to vue-sweet-calendar.d.ts.

Из папки node_modules выполняться почему-то не захотело:

d:\GitRep\vuets\node_modules>dts-gen -m vue-sweet-calendar
Couldn't load module "vue-sweet-calendar". Please install it globally (npm install -g vue-sweet-calendar) and try again.


Потом копируем получившийся файл в

d:\GitRep\vuets\types\


Подключение в проекте:
import Vue from 'vue';
import { Component } from 'vue-property-decorator';
import { Calendar } from 'vue-sweet-calendar';
import 'vue-sweet-calendar/dist/SweetCalendar.css';

@Component({
    components: {
        Calendar
    }
})
export default class CalendarWrapperComponent extends Vue {
    data() {


Хз почему, но компонент экспортировался как Calendar, поэтому мой компонент я переименовал в CalendarWrapper.

Ну и calendarWrapper.vue.html:

<template>
<div id="calendar">
<!-- Using Component -->
<calendar :eventCategories="eventCategories"
:events="events"
ref="calendar" />
</div>
</template>

<script src="./calendarWrapper.ts"></script>

https://github.com/BlackEric001
Re: VueJs сторонние компоненты
От: VladCore  
Дата: 17.05.19 14:36
Оценка:
Здравствуйте, BlackEric, Вы писали:

BE>Солюшен создавал из vuets


А почему нет vue-sweat-calendar в package.json?
Первая ссылка твоя в самом верху предлагает сделать npm install vue-sweet-calendar --save не зря

 
Подождите ...
Wait...
Пока на собственное сообщение не было ответов, его можно удалить.