What you're trying to do is going against the normal workflow of Pixelbox, and I would not recommend it.
Can I ask what you are trying to achieve? There might be another solution available, or it could be an opportunity for a new feature.
You can make modifications directly to the pixelbox package in node_modules/pixelbox. Be careful since the package may be overwritten by the "Project > Update libraries" command.
Building the game from command line should also be possible, but some setup are required.
For example, let's say you want to build with Webpack. Here's how the webpack.config,js should look (notice the raw-loader for .vert and .frag files, and the use of external for electron):
const path = require('path'); module.exports = { mode: 'development', entry: './src/index.js', output: { path: path.resolve(__dirname, 'build'), filename: 'index.js', }, module: { rules: [ { test: /\.vert$/i, use: [{ loader: 'raw-loader', options: { esModule: false } }] }, { test: /\.frag$/i, use: [{ loader: 'raw-loader', options: { esModule: false } }] }, ], }, externals: ['electron']
};
The index,js in your project needs to define a bunch of constants that Pixelbox needs (the most non-obvious one being __PROJECT_DATA__ as it contains the assets map and settings that are normally automatically generated), and then require the bootstrap:
window.DEBUG = true; window.__USE_CORE__ = true
window.__USE_WEBGL__ = true
window.__MINI_TEXT__ = true
window.__KEYBOARD__ = true
window.__GAMEPAD__ = false
window.__USE_AUDIO__ = false
window.__USE_TRACKER__ = false
window.__USE_BLEEPER__ = false
window.__USE_TINA__ = false
window.__CUSTOM_LOADER__ = false
window.__HAS_ATLAS__ = false
window.__NO_CONTEXT_MENU__ = true
window.__BUILD_TYPE__ = 'pixelbox'
window.__PROJECT_DATA__ = { dat: { palette: null, tilesheet: null, maps: { _type: "maps", maps: [] } }, root: "assets/", img: ["palette.png", "tilesheet.png"], snd: [], settings: { name: "PixelboxProject", screen: { fullscreen: false, resizable: true, keepAspectRatio: false, width: 128, height: 128, pixelSize: { width: 4, height: 4 } }, tileSize: { width: 8, height: 8 }, palette: { file: "palette" }, controls: { up: 38, down: 40, left: 37, right: 39, A: 32, B: 88 }, touchEvent: { multiTouch: false, disableContextMenu: true, hideMousePointer: false }, gamepad: { analogToDpad: true, deadZone: 0.5 }, loader: { colors: ["#140C1C", "#DEEED6"] } }
} require('pixelbox/bootstrap')
I also had to modify the main.js to expose the update function the ES6 way, or Webpack would complain:
function update() { // ... } export { update }