Как импортировать компонент?

Рейтинг: 0Ответов: 2Опубликовано: 22.01.2023

хотел добавить себе компонент vue-pincode-input, установил его через терминал, посмотрел нотацию об этом, сильно не понял как импортировать, когда начинаю его использовать компонент в штмл, то ошибка ссылается на первую строчку, как это исправить ?

import PincodeInput from 'vue-pincode-input';
const app = new Vue({
   el: '#app',
   components: {
      PincodeInput,
   },
   data() {
      return {
         code: null
      }
   },
   methods: {

   },
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>

Ответы

▲ 1Принят

Если вы не используете к-л сборщик (например, Webpack или Vite), то путь в импорте "vue-pincode-input" не валиден.

Чтобы использовать ES6 импорты, нужно:

  • Чтобы тег <script>, в котором ваш код находится, имел аттрибут type="module"
  • В самом импорте путь должен быть полный и относительный (пример с npm: "./node_modules/vue-pincode-input/index.js")
▲ 0

Вам нужно установить vue c использование npm https://v3.ru.vuejs.org/ru/guide/installation.html#npm