javascript - 如何在 webpack 中包含 ogg 和 mp3 文件格式?
问题描述
我有 Phaser3 项目,我正在开发,目前正在尝试为游戏添加音乐和声音。但是,我无法加载任何声音文件,但它位于 src/assets 文件夹中。我正在使用 webpack 来运行 localhost。下面的文件(base.js)表明我允许声音格式,但由于某种原因它没有加载,可能是基本文件不正确。
错误日志:
8080/assets/hit.ogg:1 Failed to load resource: the server responded with a status of 404 (Not Found)
base.js
const webpack = require("webpack");
const path = require("path");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const { CleanWebpackPlugin } = require("clean-webpack-plugin");
module.exports = {
mode: "development",
devtool: "eval-source-map",
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: "babel-loader"
}
},
{
test: [/\.vert$/, /\.frag$/],
use: "raw-loader"
},
{
test: /\.(gif|png|jpe?g|svg|xml|ogg|wav|mp3)$/i,
use: "file-loader"
}
]
},
plugins: [
new CleanWebpackPlugin({
root: path.resolve(__dirname, "../")
}),
new webpack.DefinePlugin({
CANVAS_RENDERER: JSON.stringify(true),
WEBGL_RENDERER: JSON.stringify(true)
}),
new HtmlWebpackPlugin({
template: "./index.html"
})
]
};
如何修复文件,以便允许加载声音/音乐文件。TIA。
解决方案
我最终使用require('./assets/hit.ogg')
了 Node.js。不确定它在部署时是否会导致问题,但它可以在 localhost 中运行。
推荐阅读
- sql - 解决 Oracle order by query 的性能开销
- c++ - C++17,制作一个使用依赖于模板参数的 std::variant 的可变参数模板?
- c# - 项目的默认XML命名空间必须是在Visual Studio 2017.0中安装.Net Core 3后的MSBuild XML命名空间错误
- sql-server - BULK INSERT 完成,0 行受影响。SSMS v18.2
- python - 将 Django 项目从 Python 2 转换为 Python 3:django.core.exceptions.AppRegistryNotReady:尚未加载应用程序
- android - Android 中的 NullPointerException setSelection 微调器
- javascript - 我如何过滤 Antd 中的列
- go - 解析 go.mod:意外的模块路径“howett.net/plist”
- python - Pyspark动态框架无缘无故添加额外的空白列
- xml - 如何使用 JAXB 和 xsd 模式验证 xml 元素是否为空?