CODEWITHSUNDEEP
vue.jsvuejs2vue-component
Mikkel Fennefoss
Mikkel Fennefoss

Reputation: 909

Importing Vanilla js file to Vue.js component

I have previously made some drag and drop functionality in vanilla JS which I have used in other projects. Now I have started a Vue.js project and I would like to use the same drag and drop functionality.

Is it possible to include a vanilla JS file in a Vue.js component? And how can it be done?

So far I have only tried to add a <script> tag in the head element in the index.html but it throws an error.

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

Upvotes: 0

Views: 12686

Answers (1)

Julxzs
Julxzs

Reputation: 737

You can import the script within your vue component with either

  1. import

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

  2. require

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

in the script section of your component.

e.g. 

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

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

Upvotes: 9

Related Questions