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

Question

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

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

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

<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>