Updated configs to use webpack5 and export an ESM version of Phaser

This commit is contained in:
Richard Davey 2023-03-22 16:04:57 +00:00
parent 3dc0b77374
commit d5cfea045c
2 changed files with 214 additions and 111 deletions

View file

@ -3,71 +3,111 @@
const webpack = require('webpack');
const exec = require('child_process').exec;
// https://webpack.js.org/configuration/configuration-types/#exporting-multiple-configurations
module.exports = [
module.exports = {
mode: 'development',
{
mode: 'development',
context: `${__dirname}/../src/`,
context: `${__dirname}/../src/`,
entry: {
phaser: './phaser.js'
},
entry: {
phaser: './phaser.js'
},
devtool: 'source-map',
devtool: 'source-map',
output: {
path: `${__dirname}/../build/`,
filename: '[name].js',
library: 'Phaser',
libraryTarget: 'umd',
sourceMapFilename: '[file].map',
devtoolModuleFilenameTemplate: 'webpack:///[resource-path]', // string
devtoolFallbackModuleFilenameTemplate: 'webpack:///[resource-path]?[hash]', // string
umdNamedDefine: true,
globalObject: 'this'
},
/*
output: {
path: `${__dirname}/../build/`,
globalObject: 'this',
sourceMapFilename: '[file].map',
devtoolModuleFilenameTemplate: 'webpack:///[resource-path]', // string
devtoolFallbackModuleFilenameTemplate: 'webpack:///[resource-path]?[hash]', // string
filename: '[name].js',
library: {
name: 'Phaser',
type: 'umd',
umdNamedDefine: true,
}
},
*/
performance: { hints: false },
plugins: [
new webpack.DefinePlugin({
"typeof CANVAS_RENDERER": JSON.stringify(true),
"typeof WEBGL_RENDERER": JSON.stringify(true),
"typeof WEBGL_DEBUG": JSON.stringify(true),
"typeof EXPERIMENTAL": JSON.stringify(true),
"typeof PLUGIN_3D": JSON.stringify(false),
"typeof PLUGIN_CAMERA3D": JSON.stringify(false),
"typeof PLUGIN_FBINSTANT": JSON.stringify(false),
"typeof FEATURE_SOUND": JSON.stringify(true)
}),
{
apply: (compiler) => {
compiler.hooks.afterEmit.tap('AfterEmitPlugin', (compilation) => {
exec('node scripts/copy-to-examples-watch.js', (err, stdout, stderr) => {
if (stdout) process.stdout.write(stdout);
if (stderr) process.stderr.write(stderr);
});
});
output: {
path: `${__dirname}/../build/`,
globalObject: 'this',
sourceMapFilename: '[file].map',
devtoolModuleFilenameTemplate: 'webpack:///[resource-path]', // string
devtoolFallbackModuleFilenameTemplate: 'webpack:///[resource-path]?[hash]', // string
filename: '[name].js',
library: {
name: 'Phaser',
type: 'umd',
umdNamedDefine: true,
}
}
],
},
devtool: 'source-map'
};
performance: { hints: false },
plugins: [
new webpack.DefinePlugin({
"typeof CANVAS_RENDERER": JSON.stringify(true),
"typeof WEBGL_RENDERER": JSON.stringify(true),
"typeof WEBGL_DEBUG": JSON.stringify(true),
"typeof EXPERIMENTAL": JSON.stringify(true),
"typeof PLUGIN_3D": JSON.stringify(false),
"typeof PLUGIN_CAMERA3D": JSON.stringify(false),
"typeof PLUGIN_FBINSTANT": JSON.stringify(false),
"typeof FEATURE_SOUND": JSON.stringify(true)
}),
{
apply: (compiler) => {
compiler.hooks.afterEmit.tap('AfterEmitPlugin', (compilation) => {
exec('node scripts/copy-to-examples-watch.js', (err, stdout, stderr) => {
if (stdout) process.stdout.write(stdout);
if (stderr) process.stderr.write(stderr);
});
});
}
}
],
devtool: 'source-map'
},
{
experiments: {
outputModule: true,
},
mode: 'development',
context: `${__dirname}/../src/`,
entry: {
phaser: './phaser-esm.js'
},
devtool: 'source-map',
output: {
path: `${__dirname}/../build/`,
sourceMapFilename: 'phaser.esm.js.map',
devtoolModuleFilenameTemplate: 'webpack:///[resource-path]', // string
devtoolFallbackModuleFilenameTemplate: 'webpack:///[resource-path]?[hash]', // string
filename: 'phaser.esm.js',
library: {
type: 'module'
}
},
performance: { hints: false },
plugins: [
new webpack.DefinePlugin({
"typeof CANVAS_RENDERER": JSON.stringify(true),
"typeof WEBGL_RENDERER": JSON.stringify(true),
"typeof WEBGL_DEBUG": JSON.stringify(true),
"typeof EXPERIMENTAL": JSON.stringify(true),
"typeof PLUGIN_3D": JSON.stringify(false),
"typeof PLUGIN_CAMERA3D": JSON.stringify(false),
"typeof PLUGIN_FBINSTANT": JSON.stringify(false),
"typeof FEATURE_SOUND": JSON.stringify(true)
}),
{
apply: (compiler) => {
compiler.hooks.afterEmit.tap('AfterEmitPlugin', (compilation) => {
exec('node scripts/copy-esm-to-examples-watch.js', (err, stdout, stderr) => {
if (stdout) process.stdout.write(stdout);
if (stderr) process.stderr.write(stderr);
});
});
}
}
],
devtool: 'source-map'
}
];

View file

@ -4,62 +4,125 @@ const webpack = require('webpack');
const TerserPlugin = require('terser-webpack-plugin');
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
module.exports = {
mode: 'production',
module.exports = [
{
name: 'phaser-umd',
mode: 'production',
context: `${__dirname}/../src/`,
context: `${__dirname}/../src/`,
entry: {
phaser: './phaser.js',
'phaser.min': './phaser.js',
'phaser-arcade-physics': './phaser-arcade-physics.js',
'phaser-arcade-physics.min': './phaser-arcade-physics.js',
'phaser-ie9': './phaser-ie9.js',
'phaser-ie9.min': './phaser-ie9.js'
},
entry: {
phaser: './phaser.js',
'phaser.min': './phaser.js',
'phaser-arcade-physics': './phaser-arcade-physics.js',
'phaser-arcade-physics.min': './phaser-arcade-physics.js',
'phaser-ie9': './phaser-ie9.js',
'phaser-ie9.min': './phaser-ie9.js'
},
output: {
path: `${__dirname}/../dist/`,
filename: '[name].js',
library: 'Phaser',
libraryTarget: 'umd',
umdNamedDefine: true,
globalObject: 'this'
},
output: {
path: `${__dirname}/../dist/`,
filename: '[name].js',
globalObject: 'this',
library: {
name: 'Phaser',
type: 'umd',
umdNamedDefine: true,
}
},
performance: { hints: false },
performance: { hints: false },
optimization: {
minimizer: [
new TerserPlugin({
include: /\.min\.js$/,
parallel: true,
extractComments: false,
terserOptions: {
format: {
comments: false
},
compress: true,
ie8: false,
ecma: 5,
warnings: false
}
})
optimization: {
minimizer: [
new TerserPlugin({
include: /\.min\.js$/,
parallel: true,
extractComments: false,
terserOptions: {
format: {
comments: false
},
compress: true,
ie8: false,
ecma: 5,
warnings: false
}
})
]
},
plugins: [
new webpack.DefinePlugin({
"typeof CANVAS_RENDERER": JSON.stringify(true),
"typeof WEBGL_RENDERER": JSON.stringify(true),
"typeof WEBGL_DEBUG": JSON.stringify(false),
"typeof EXPERIMENTAL": JSON.stringify(false),
"typeof PLUGIN_3D": JSON.stringify(false),
"typeof PLUGIN_CAMERA3D": JSON.stringify(false),
"typeof PLUGIN_FBINSTANT": JSON.stringify(false),
"typeof FEATURE_SOUND": JSON.stringify(true)
}),
new CleanWebpackPlugin()
]
},
{
experiments: {
outputModule: true,
},
plugins: [
new webpack.DefinePlugin({
"typeof CANVAS_RENDERER": JSON.stringify(true),
"typeof WEBGL_RENDERER": JSON.stringify(true),
"typeof WEBGL_DEBUG": JSON.stringify(false),
"typeof EXPERIMENTAL": JSON.stringify(false),
"typeof PLUGIN_3D": JSON.stringify(false),
"typeof PLUGIN_CAMERA3D": JSON.stringify(false),
"typeof PLUGIN_FBINSTANT": JSON.stringify(false),
"typeof FEATURE_SOUND": JSON.stringify(true)
}),
name: 'phaser-esm',
mode: 'production',
dependencies: [ 'phaser-umd' ],
new CleanWebpackPlugin()
]
};
context: `${__dirname}/../src/`,
entry: {
'phaser.esm': './phaser-esm.js',
'phaser.esm.min': './phaser-esm.js'
},
output: {
path: `${__dirname}/../dist/`,
filename: '[name].js',
library: {
type: 'module'
}
},
performance: { hints: false },
optimization: {
minimizer: [
new TerserPlugin({
include: /\.min\.js$/,
parallel: true,
extractComments: false,
terserOptions: {
format: {
comments: false
},
compress: true,
ie8: false,
ecma: 6,
warnings: false
}
})
]
},
plugins: [
new webpack.DefinePlugin({
"typeof CANVAS_RENDERER": JSON.stringify(true),
"typeof WEBGL_RENDERER": JSON.stringify(true),
"typeof WEBGL_DEBUG": JSON.stringify(false),
"typeof EXPERIMENTAL": JSON.stringify(false),
"typeof PLUGIN_3D": JSON.stringify(false),
"typeof PLUGIN_CAMERA3D": JSON.stringify(false),
"typeof PLUGIN_FBINSTANT": JSON.stringify(false),
"typeof FEATURE_SOUND": JSON.stringify(true)
})
]
}
];