Vue | Как правильно импортировать мой. js файл? - PullRequest
Новая
       4

Vue | Как правильно импортировать мой. js файл?

1 голос
/ 22 марта 2020

Извините, если мой вопрос будет глупым, но я новичок ie в Vue :( Я испытываю какой-то парадокс, определенно есть что-то, что я делаю неправильно. У меня есть. js файл с некоторыми функциями в jquery. Я хочу импортировать его в мое приложение vue. Поэтому я использую в приложении. vue: 

import { fabric } from 'fabric'
import '../src/main-copy.js'

В первой строке я импортирую fabri c использовать canvas, и во второй строке я пытаюсь импортировать мой файл, но он получает ошибки: 

Failed to compile.

./src/main-copy.js
Module Error (from ./node_modules/eslint-loader/index.js):

C:\path\vue-test\src\main-copy.js
    8:1   error  '$' is not defined                        no-undef
    9:35  error  'fabric' is not defined                   no-undef
  120:11  error  '$' is not defined                        no-undef
  162:12  error  'tf' is not defined                       no-undef
  164:22  error  'tf' is not defined                       no-undef
  167:25  error  'tf' is not defined                       no-undef
  170:24  error  'tf' is not defined                       no-undef
  171:28  error  'tf' is not defined                       no-undef

Поэтому я установил jquery и тензор потока с npm и импортировал его в приложение. vue: 

import { fabric } from 'fabric'
import { jquery } from 'jquery'
import { tensorflow } from 'tensorflow'
import '../src/main-copy.js'

Но когда я добавляю этот импорт, я получаю новые ошибки: 

Failed to compile.

./src/App.vue
Module Error (from ./node_modules/eslint-loader/index.js):

C:\path\vue-test\src\App.vue
  11:10  error  'jquery' is defined but never used      no-unused-vars
  12:10  error  'tensorflow' is defined but never used  no-unused-vars

Я даже пытался добавить простой 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@latest"></script>

в индекс. html, но безрезультатно. Что я делаю не так? Пожалуйста, помогите.

Часть основной копии. js: 

var model;
var canvas;
var classNames = [];
var coords = [];
var mousePressed = false;

$(function() {
    canvas = window._canvas = new fabric.Canvas('canvas');
    canvas.backgroundColor = '#ffffff';
    canvas.isDrawingMode = 0;
    canvas.freeDrawingBrush.color = "black";
    canvas.freeDrawingBrush.width = 10;
    canvas.renderAll();
    canvas.on('mouse:up', function(e) {
        getFrame();
        mousePressed = false;
    });
    canvas.on('mouse:down', function(e) {
        mousePressed = true;
    });
    canvas.on('mouse:move', function(e) {
        recordCoor(e);
    });
});
...