如何在vue loader组件中导入JS脚本？ [英] How to import JS script in vue loader component?

问题描述

我有一个vue-component

I have a vue-component

vue-compoennt（vue-loader）

<template>
  <p>This is a template</p>
</template>
<script>
  require('main.js')
  huha()
</script>

我有

main.js

 var huha = function(){
      alert("this is huha");
    }; 
alert("this is simple alert");

这里我得到'简单警报'，但在评估huha（）时显示参考错误。有人可以帮我理解为什么会这样吗？

Here I get the 'simple alert' but in assessing huha() it is showing reference error. Can someone please help me to understand why is this happening?

编辑

我正在尝试使用testimonial.js作为以下内容，我收到参考错误。

I am trying to use testimonial.js as following and I am getting reference error.

    <template>
      <p>This is a template</p>
      <div id="testimonial-slider"></div>
    </template>
    <script>
      require('testimonial/testimonial.js')
      require('testimonial/testimonial.css')
      var testimonial = new Testimonial('#testimonial-slider');
    </script>
    <style>
      p{
         color: red;
        }
    </style>

提供参考错误：证词未定义

It is giving "reference error: Testimonial is not defined"

推荐答案

你需要导出一个这样的函数：

You need to export a function like so:

module.exports = {
    huha: function(){
      return alert("this is huha");
    }
}; 

然后在你的组件文件中：

And then in you components file:

<template>
  <p>This is a template</p>
</template>
<script>
  var main = require('main.js')
  main.huha()
</script>

这篇关于如何在vue loader组件中导入JS脚本？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！