Javascript 如何将CreateJS导入到VueJS.vue组件中？

我提前道歉，我对Vuejs总体上还是很陌生的。我正在尝试将CreateJS/SoundJS导入到.vue组件中。我已经通过npm安装了CreateJS。我只是不知道如何将库导入到组件中，以便可以引用声音函数。我似乎在CreateJS文档中找不到任何关于这种用法的信息。。。任何代码或参考链接将不胜感激。谢谢

我使用CreateJS/SoundJS库做了一个示例，从CDN导入它

在public/index.html文件中，添加标记：

<script src="https://code.createjs.com/1.0.0/soundjs.min.js"></script>

在src/App.vue组件（或任何组件，但App.vue是应用程序的入口点，因此它是一个很好的地方）中，配置声音：

<template>
  <div id="app">
    <img alt="Vue logo" src="./assets/logo.png" />
    <HelloWorld msg="Welcome to Your Vue.js App" />
    <button @click="play">Play</button>
    <!-- button to call the play method -->
  </div>
</template>

<script>
import HelloWorld from "./components/HelloWorld.vue";
const hornSound = require("@/assets/hey.mp3"); // Store a mp3 file in a variable, You can add more sounds, here on in another components

export default {
  name: "App",
  components: {
    HelloWorld
  },
  methods: {
    play() {
      this.createjs.Sound.play("Horn"); // Acces and play the sound with the id "Horn"
    }
  },
  created() {
    const soundId = "Horn"; // Id of the sound to be registered 
    this.createjs.Sound.registerSound(hornSound, soundId); // Register the sound, using the mp3 and the id
    // You can do this with any amount of sounds, here or in any component
    // Once a sound is registered, you have access to it in all the components
  }
};
</script>

玩
从“/components/HelloWorld.vue”导入HelloWorld；
const hornSound=require（“@/assets/hey.mp3”）；//将一个mp3文件存储在一个变量中，可以添加更多的声音，这里就在另一个组件中
导出默认值{
名称：“应用程序”，
组成部分：{
你好世界
},
方法：{
play（）{
this.createjs.Sound.play（“Horn”）；//访问并播放id为“Horn”的声音
}
},
创建（）{
const soundId=“Horn”//要注册的声音的Id
this.createjs.Sound.registerSound（hornSound，soundId）；//使用mp3和id注册声音
//您可以在此处或任何组件中使用任意数量的声音来执行此操作
//注册声音后，您可以在所有组件中访问它
}
};

播放子组件的声音（src/components/HelloWorld.vue）：

createjs/soundjs的Hello World
在子组件内播放
导出默认值{
名称：“HelloWorld”，
道具：{
msg:String
},
方法：{
playFromChild（）{
this.createjs.Sound.play（“Horn”）；//我们正在访问id为“Horn”的声音，而不导入任何内容
}
}
};

---

我希望这能对您有所帮助，我试图解释如何使用它，但正如您所说，没有关于它的文档，所以这可能很棘手，但它可以工作。

谢谢！这不是我一直在寻找的，但会有用的。经过一些搜索，我在createjs的npm安装中找到了一个自述文件。声明只支持ES5；查阅GitHub repo，SoundJS的最后一次提交是在发表此评论时的1年多以前；不确定是否继续积极维护。我可能最终会寻找另一个音频插件，我们拭目以待。没问题！我不知道这种图书馆，但它很酷

<template>
  <div id="app">
    <img alt="Vue logo" src="./assets/logo.png" />
    <HelloWorld msg="Welcome to Your Vue.js App" />
    <button @click="play">Play</button>
    <!-- button to call the play method -->
  </div>
</template>

<script>
import HelloWorld from "./components/HelloWorld.vue";
const hornSound = require("@/assets/hey.mp3"); // Store a mp3 file in a variable, You can add more sounds, here on in another components

export default {
  name: "App",
  components: {
    HelloWorld
  },
  methods: {
    play() {
      this.createjs.Sound.play("Horn"); // Acces and play the sound with the id "Horn"
    }
  },
  created() {
    const soundId = "Horn"; // Id of the sound to be registered 
    this.createjs.Sound.registerSound(hornSound, soundId); // Register the sound, using the mp3 and the id
    // You can do this with any amount of sounds, here or in any component
    // Once a sound is registered, you have access to it in all the components
  }
};
</script>

    <template>
      <div class="hello">
        <h3>Hello World with createjs/soundjs</h3>
        <button @click="playFromChild">Play inside child component</button>
      </div>
    </template>

    <script>
    export default {
      name: "HelloWorld",
      props: {
        msg: String
      },
      methods: {
        playFromChild() {
          this.createjs.Sound.play("Horn"); // We are accessing to the sound with id "Horn" without import anything
        }
      }
    };
    </script>