- app.jsx: mount Phaser in useEffect (not render), import Phaser properly - webpack: add CopyWebpackPlugin to bundle public/ assets into dist/ - nginx: serve .tmj/.json/.png game assets as static files (not proxied) - colyseus.js: pin to 0.15 to match server @colyseus/schema 2.x - Result: zero JS errors, tilemap loads, Phaser canvas renders
94 lines
2.0 KiB
JavaScript
94 lines
2.0 KiB
JavaScript
const path = require("path");
|
|
const HtmlWebpackPlugin = require("html-webpack-plugin");
|
|
const CopyWebpackPlugin = require("copy-webpack-plugin");
|
|
|
|
module.exports = {
|
|
mode: "development",
|
|
entry: {
|
|
index: "./src/index.js",
|
|
},
|
|
resolve: {
|
|
alias: {
|
|
PhaserClasses: path.resolve(__dirname, "src/phaserClasses/"),
|
|
Components: path.resolve(__dirname, "src/components/"),
|
|
Entities: path.resolve(__dirname, "src/entities/"),
|
|
Scenes: path.resolve(__dirname, "src/scenes/"),
|
|
Scripts: path.resolve(__dirname, "src/scripts/"),
|
|
Styles: path.resolve(__dirname, "src/styles/"),
|
|
Systems: path.resolve(__dirname, "src/systems/"),
|
|
},
|
|
},
|
|
devtool: "inline-source-map",
|
|
devServer: {
|
|
static: "./public",
|
|
headers: {
|
|
"Access-Control-Allow-Origin": "*",
|
|
"Access-Control-Allow-Methods": "OPTIONS, POST, GET",
|
|
},
|
|
},
|
|
plugins: [
|
|
new CopyWebpackPlugin({
|
|
patterns: [{ from: "public", to: "." }],
|
|
}),
|
|
new HtmlWebpackPlugin({
|
|
title: "Game Server",
|
|
meta: {
|
|
language: {
|
|
httpEquiv: "Content-Language",
|
|
content: "en_US",
|
|
},
|
|
viewport: {
|
|
key: "viewport",
|
|
content: "initial-scale=1, width=device-width",
|
|
},
|
|
},
|
|
templateContent: ({ htmlWebpackPlugin }) => `
|
|
<html>
|
|
<head>
|
|
${htmlWebpackPlugin.tags.headTags}
|
|
<title>Restitution</title>
|
|
</head>
|
|
<body>
|
|
<div id="root"></div>
|
|
${htmlWebpackPlugin.tags.bodyTags}
|
|
</body>
|
|
</html>
|
|
`,
|
|
}),
|
|
],
|
|
output: {
|
|
filename: "[name].[contenthash].js",
|
|
path: path.resolve(__dirname, "dist"),
|
|
clean: true,
|
|
},
|
|
optimization: {
|
|
runtimeChunk: "single",
|
|
},
|
|
module: {
|
|
rules: [
|
|
{
|
|
test: /\.(ts|js)x?$/,
|
|
exclude: /node_modules/,
|
|
use: {
|
|
loader: "babel-loader",
|
|
options: {
|
|
presets: ["@babel/preset-env", "@babel/preset-react"],
|
|
},
|
|
},
|
|
},
|
|
{
|
|
test: /\.css$/i,
|
|
use: ["style-loader", "css-loader"],
|
|
},
|
|
{
|
|
test: /\.(png|svg|jpg|jpeg|gif)$/i,
|
|
type: "asset/resource",
|
|
},
|
|
{
|
|
test: /\.(woff|woff2|eot|ttf|otf)$/i,
|
|
type: "asset/resource",
|
|
},
|
|
],
|
|
},
|
|
};
|