将Vanilla js文件导入Vue.js组件

Question

我之前已经在其他项目中使用的Vanilla JS中做了一些拖放功能。现在，我开始了一个Vue.js项目，我想使用相同的拖放功能。

是否可以在Vue.js组件中包含普通JS文件？怎么办呢？

到目前为止，我只尝试在index.html的head元素中添加一个<script>标记，但是会引发错误。

<script src="../src/js/drag-and-drop.js"></script>

Answer 1

您可以使用以下任一方法将脚本导入vue组件中

1. 导入

   import '../src/js/drag-and-drop.js';

2. 需要

   require('../src/js/drag-and-drop.js');

在组件的脚本部分。

例如

<template>
  <!-- vue component markup -->
</template>

<script> 
import drag from '../src/js/drag-and-drop';
export default {
  name: 'you-vue-component',
}    
</script>