соответствующий модуль не найден: vue-lottie - PullRequest
Новая
       7

соответствующий модуль не найден: vue-lottie

0 голосов
/ 02 ноября 2018

После новой сборки с помощью vue-cli (3.0.0-rc.5) путь к модулю лотереи недоступен. Должен ли я играть с конфигами?

  • . / Lottie.vue in ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist /cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/HelloWorld.vue?vue&type=script&lang=js&
<template>
<div id="app">
    <lottie :options="defaultOptions" :height="400" :width="400" v-on:animCreated="handleAnimation"/>
    <div>
        <p>Speed: x{{animationSpeed}}</p>
        <input type="range" value="1" min="0" max="3" step="0.5"
               v-on:change="onSpeedChange" v-model="animationSpeed">
    </div>
    <button v-on:click="stop">stop</button>
    <button v-on:click="pause">pause</button>
    <button v-on:click="play">play</button>
</div>


<script>
      import Lottie from './lottie.vue';
      import * as animationData from './assets/data.json';
      export default {
        name: 'app',
        components: {
          'lottie': Lottie
        },
        data() {
          return {
            defaultOptions: {animationData: animationData},
            animationSpeed: 1
          }
        },
        methods: {
          handleAnimation: function (anim) {
            this.anim = anim;
          },
          stop: function () {
            this.anim.stop();
          },
          play: function () {
            this.anim.play();
          },
          pause: function () {
            this.anim.pause();
          },
          onSpeedChange: function () {
            this.anim.setSpeed(this.animationSpeed);
          }
        }
      }
    </script>

Ответы [ 2 ]

0 голосов
/ 15 марта 2019

Если это все еще не работает, замените animationData на animationData.default в defaultOptions 

defaultOptions: { animationData: animationData.default }
0 голосов
/ 02 ноября 2018

Если вы используете vue-lottie пакет, то импорт должен быть 

import Lottie from 'vue-lottie';

Это потому, что пакет lottie находится в папке node_modules, и вы должны указать правильный путь или использовать прямой импорт имени пакета. С другой стороны, я считаю, что текущая версия Vue cli - v3.1.1, поэтому вам обязательно нужно обновить.

...