Vue.js-無法使用Blazy

Question

我想使用Blazy包在我的Vue.js項目中延遲加載圖像。 我通過npm安裝了它，但是我無法導入並使用它。 我將此代碼放在App.vue的created方法中：

const bLazy = new Blazy({})

組件中用於顯示圖像的代碼如下：

<img src="placeholder" :data-src="image-src" class="w-100 rounded" :alt="name">

現在，我嘗試導入它並使它工作：

import Blazy from 'blazy' =>無效。

import * as Blazy from 'blazy' =>無效。

require('blazy') => "ReferenceError: Blazy is not defined" 。

const Blazy = require('blazy') =>無效。

使它起作用的正確方法是什么？

Answer 1

這既不是Vue也不是npm問題。 Blazy是一個非常老的庫（最近2年更新），並且不支持模塊導入語法（因為它不是模塊）。 您有兩種選擇：

1. 為此找到一個更好的庫，充其量是Vue的插件。
2. 將包的代碼復制到src的文件中，然后導出Blazy對象。