Vue前端项目中创建了一个公共的JavaScript工具类，并定义了一些公共方法后，可以在需要的组件中引用并调用这些公共方法。

        1.创建一个名为 utils.js 的JavaScript文件，定义一个公共的工具类，包含一个用于计算平方的方法：

// utils.jsexport default {square(num) {return num * num;},
};

        2.在需要使用计算平方功能的Vue组件中，引入并调用 utils.js 中定义的方法：

<template><div><p>Enter a number:</p><input type="number" v-model="number"><button @click="calculateSquare">Calculate Square</button><p v-if="result !== null">Square of {{ number }} is: {{ result }}</p></div>
</template><script>
import utils from './utils.js';export default {data() {return {number: null,result: null,};},methods: {calculateSquare() {if (this.number !== null) {this.result = utils.square(this.number);}},},
};
</script>

         建了一个名为 utils.js 的公共工具类，并在其中定义了一个 square 方法用于计算数字的平方。然后，在需要使用计算平方功能的Vue组件中，通过引入 utils.js 文件并调用 square 方法来计算输入数字的平方，并将结果显示在页面上。这样就实现了在Vue组件中引用并调用公共JavaScript工具类中的方法。