How to import a function to a Vue component?

Question

I am trying to import a single function to my Vue component. I've created a separated js file for my function:

randomId.js:

exports.randomId = () => //My function ...

In my Vue component, I've imported the Random js:

let randomId = require('../functions/randomId');
randomId();

but Webpack throws an error of "randomId is not a function". I tried to import the file using import syntax, but the error remains.

import randomId from '../functions/randomId';

Should I use some other methods for importing single functions? I'm relatively new to Webpack and JS6.

Answer 1

Change your function module to properly use ES6 export:

export function randomId() { /*My function ...*/ }

And then use ES6 named import:

import { randomId } from '../functions/randomId';