Vue.js 是否在vue组件中使用普通javascript文件？

我有一个名为

Helper.js

的文件，其中包含使用一些库的函数。 现在我有了一个

TestComponent.vue

文件，希望使用这个助手函数。如何注入这些功能

我试图在Components块中直接使用

Helper.js

中使用的库，但无论index.html标记的顺序如何，似乎vue都是在包含任何库之前运行的

---

如何使用.js文件或其他库

要在Vue模板中使用其他库或帮助函数，只需将它们导入模板的脚本标记即可：

TestComponent.vue

<template>
<!-- template markup -->
</template>

<script>
import Helper from 'relative/path/to/Helper.js'
// or just a helper function (that should be exported accordingly
import { helperFunction } from 'relative/path/to/Helper.js'

export default {
   name: 'TestComponent'
   // component data, methods, etc are now able to use imported variables 
}
</script>

从“relative/path/to/Helper.js”导入助手
//或者只是一个助手函数（应该相应地导出）
从'relative/path/to/Helper.js'导入{helperFunction}
导出默认值{
名称：“TestComponent”
//组件数据、方法等现在可以使用导入的变量
}

通过这种方式，您可以在组件中使用任何附加的JS。Webpack会将其包含在捆绑包中。但是，如果在许多组件中使用库，则维护或重复导入可能会变得不舒服。在这种情况下，可以在创建Vue实例的主应用程序文件中定义Vue原型上的库，这将使其可从任何组件访问

从“时刻”导入时刻；
Object.definePrototype（Vue.prototype，'$moment'，{value:moment}）；

请按照下面的说明进行详细解释和更好的实践。

正确答案是：

首先需要导入库，以便定义属性

import moment from 'moment';
Object.defineProperty(Vue.prototype, '$moment', { value: moment });

请注意，您应该使用define属性，而不是define原型

---

通过这种方式，您可以向Vue中调用如下内容：

This.$moment（）；

最简单的方法：在Vue自己的脚本标记之前包含带有标记的文件。我在

之前做过，但没有成功。是否使用生成工具？您可以在组件文件中导入库，并使用其功能（确保你的库导出你需要的东西）。那么Vue.js插件呢？这是“导入”库的方式吗？你使用的是webpack吗？