Как импортировать js-файл из cdn?

#vue.js #vuejs2 #vue-component #pdf.js

#vue.js #vuejs2 #vue-компонент #pdf.js

Вопрос:

Как мы импортируем js-файл из cdn? Я создаю пользовательский компонент (компонент-оболочку) для просмотра файлов pdf. и для этого мне нужно использовать pdf.js файл из cdn, и я не могу импортировать файл?

следующее не работает

 import "https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.2.228/pdf.min.js";
 

Комментарии:

1. github.com/FranckFreiburger/vue-pdf

2. @Dan Я хочу создать свой собственный компонент-оболочку.

3. npmjs.com/package/webpack-cdn-plugin

4. и в официальных документах vue есть документ, если вы хотите создать свое приложение в качестве библиотеки компонентов. это один из вариантов сборки.

Ответ №1:

Чтобы импортировать файл JS из CDN и использовать в vue.js компонент, вы можете использовать смонтированный жизненный цикл, и там вам нужно добавить свой скрипт в DOM.

Тогда он будет доступен в глобальной переменной вашего окна.

Пример рабочего кода:

 mounted () {
  let pdfJS = document.createElement('script')
  pdfJS.setAttribute('src', 'https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.2.228/pdf.min.js')
  document.head.appendChild(pdfJS)
  // for checking whether it's loaded in windows are not, I am calling the below function.
  this.checkPDFJSLib()
},
methods: {
  checkPDFJSLib() {
    console.log(window.pdfjsLib)
  }
}
 

Ответ №2:

Обычно вы можете включить его в свой index.html

 <script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.2.228/pdf.min.js"></script>

 

В качестве альтернативы вы можете использовать библиотеку npm, например vue-pdf

установите его в свои модули

npm install --save vue-pdf

и использовать его

import pdf from 'vue-pdf'