azerion / phaser-input

Adds input boxes to Phaser like CanvasInput, but also works for WebGL and Mobile, made for Phaser only.
MIT License
201 stars 64 forks source link

Fix issues when referencing as a dependency in another typescript project #9

Closed st0nerhat closed 7 years ago

st0nerhat commented 7 years ago

Problem 1:

The changes made in commit f080f264256857093714116d7c4ecd8be51bfe67 will cause another typescript phaser project that references phaser-input to fail to compile if that project uses requirejs, webpack, or browserify. This is because of the duplicate ambient declaration of define and module.

In order to still load phaser-input in a webpack project, take the following steps:

1) Install the exports-loader with npm i exports-loader --save-dev 2) Add the following line to the module.loaders config in webpack.config.js: {test: /phaser\-input\.js$/, loader: 'exports?Fabrique=true'} 3) Import the Fabrique namespace with var Fabrique = require("phaser-input"); 4) Add the plugin with game.add.plugin(Fabrique.Plugins.InputField) or game.add.plugin(new Fabrique.Plugins.InputField(game, game.plugins));

There is no clean solution to include proper Webpack support without rewriting the code to use external modules instead of internal modules.

Problem 2:

Another issue is that while Phaser v2.6.1 support is indicated, in reality, the typescript declarations clash because the Plugin constructor typings are different between phaser.d.ts and what is used in Plugin.ts.

AleBles commented 7 years ago

1) Indeed, I have no experience with Webpack myself, but the official documentation seems to advice such a construction as well, https://webpack.github.io/docs/shimming-modules.html

2) Yeah thanks! :)