Howl 未定义 Vue.js 2

【问题标题】：Howl is not defined Vue.js 2Howl 未定义 Vue.js 2
【发布时间】：2021-03-10 20:47:57
【问题描述】：

我安装了咆哮使用

npm install -g  howler --save

添加脚本

require('howler');

即使在我添加的 index.html 文件中

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/howler/2.0.4/howler.js"></script>

它似乎工作但每次我的应用程序重新加载（我使用 npm run serve 运行应用程序）我得到错误 Howl is not defined。然后我再次使用 npm 安装 howler 它工作，但重新加载后再次停止工作。所以基本上我需要一次又一次地重新安装howler。

【问题讨论】：

你能分享整个文件吗？我想看看您如何在实际文件中使用 howler 导入。此外，将 howler 本地安装到项目而不是全局安装。这可能会帮助您的模块更可靠地找到它。
我使用挂载的钩子创建了 Howl 实例。本地安装没有帮助。
npm install -g howler --save 毫无意义。请改用npm i howler。

标签： javascript vue.js howler.js

【解决方案1】：

安装

-g 标志告诉 NPM 全局安装包。 --save 标志告诉 NPM 在您的项目中本地安装它（并将其保存在dependencies 下的package.json 中）。这两个标志是互斥的，但-g 将覆盖--save。解决方案是删除-g 标志，同时保留--save。

如果您在项目中使用require，请不要同时从index.html 中的CDN 导入（即删除<script>）。

用法

要在您的代码中使用Howl，请确保从require('howler') 分配返回值：

const { Howl } = require('howler');

const sound = new Howl({
  src: ['sound.mp3']
});

sound.play();

【讨论】：