Импорт js файла в vue

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

Пытаюсь импортировать файл из js в VUE

Bот VUE код:

<template>
  <div class="a">
    <input type="text" PLACEHOLDER="Введите город:" v-model="city">
  </div>

  <div class="as" >
    <div class="hotel" v-for="hotel in hotels">
      <div class="name">
        <strong>Название: </strong> {{hotel.name}}
      </div>

      <div class="title">
        <strong>Описание: </strong> {{hotel.about}}
      </div>

      <div class="address">
        <strong>Адрес: </strong> {{hotel.address}}
      </div>

      <form v-if="open" class="form">
        <input v-model="client.name" placeholder="Имя">
        <input v-model="client.surname" placeholder="Фамилия">
        <input v-model="client.phone" placeholder="Номер">
        <input v-model="client.email" placeholder="Email">
        <button @click="booking(hotel.name)" class="btn">Забронировать</button>
      </form>

      <div class="but" v-if="!open">
        <button @click="openForm">Забронировать</button>
      </div>
    </div>
  </div>

  <button @click="loadMore" class="load">Загрузить еще</button>
</template>

<script>
let m = require('/src/data.js')
export default {
  data(){
    return{
      current: 5,
      open: false,
      city: '',

      client:{
        name: '',
        surname: '',
        phone: '',
        email: '',
        nameOfHotel:'',
      },

      hotels:[]
    }
  },

  methods:{
    loadMore(){
      this.current+=5
      dump(this.hotels)
    },

    booking(nameOfHotel){
      this.client.nameOfHotel = nameOfHotel
      this.open = false
    },

    openForm(){
      this.open = true
    },
  }
}

Вот js код:

function dump(obj){
const mysql = require("mysql2");

const connection = mysql.createConnection({
    host: "localhost",
    user: "root",
    database: "asd",
    password: "dsd"
});

const sql = `SELECT * FROM hotels`;
connection.connect();

connection.query(sql, function(err, results) {
    if(err) console.log(err);
    obj.push(results)
});

connection.end();
}

Вылезают такие ошибки:

ERROR in ./node_modules/mysql2/lib/server.js 3:12-26
Module not found: Error: Can't resolve 'net' in 'C:\Users\stole\WebstormProjects\untitled4\node_modules\mysql2\lib'
 @ ./node_modules/mysql2/index.js 31:17-43
 @ ./src/data.js 3:16-33
 @ ./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/App.vue?vue&type=script&lang=js 1:8-31
 @ ./src/App.vue?vue&type=script&lang=js 1:0-189 1:0-189 1:190-368 1:190-368
 @ ./src/App.vue 2:0-54 3:0-49 3:0-49 8:49-55
 @ ./src/main.js 2:0-24 3:10-13

ERROR in ./node_modules/mysql2/lib/pool_cluster.js 4:16-34
Module not found: Error: Can't resolve 'process' in 'C:\Users\stole\WebstormProjects\untitled4\node_modules\mysql2\lib'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

Ответы

Ответов пока нет.