# Customize Webpack
# Put Webpack
Webpack is used to optimize your game (move resources to the corresponding folders, generate JSON from TMX (Tiled Map Editor), Read .view files, etc.).
All the configuration is in the @rpgjs/compiler
package.
npm i rimraf @rpgjs/compiler -D
Note that
@rpgjs/compiler
does not work on version >5 of Webpack
Then, in the webpack.config.js
file, write the following lines:
const webpack = require('@rpgjs/compiler')
module.exports = webpack(__dirname)
In the .json package, put the scripts:
{
"scripts": {
"build": "rimraf dist && webpack",
"dev": "rimraf dist && webpack -w"
}
}
# Setting environment variables on the client side
Since version 3.0.0-beta.5
const webpack = require('@rpgjs/compiler')
module.exports = webpack(__dirname, {
envsClient: ['API_URL']
})
Add the envsClient
property with a value that is the same as the webpack.EnvironmentPlugin() (opens new window) parameter
If you use the dotenv (opens new window) package, remember to put the
require('dotenv').config()
line at the beginning of your code
# Changing the Webpack configuration
For example, if you want to change the file as an entry point, you can do so:
const webpack = require('@rpgjs/compiler')
module.exports = webpack(__dirname, {
extendClient: {
entry : `./src/${ process.env.RPG_TYPE == 'mmorpg' ? 'client/otherfile.ts' : 'standalone/otherfile.ts' }`
},
extendServer: {}
})
Follow the Webpack API to configure the file (opens new window)