プロジェクトでカスタムES6 Phaser.Pluginを使用しようとしたときにモジュールが見つかりません

Question

new phaser pluginを書き込もうとしており、ファイル間でES6クラスのインポートに問題があります。現在の設定は正常に構築され、出力はhereです。しかし、私は実際のフェイザーゲームでコンパイルされたプラグインを使用しようとすると...

import '../plugins/phaser-dynamic-state-transition'; 

私リンターは、私はそれが正常にビルドを見つけていることを知っている、このことから

Cannot find module './TransitionStateManager' from '~/src/plugins' 

エラーをピックアップES5プラグインをダウンロードしてゲームにインポートしようとしました。また、プラグインのsrcにファイルが1つしかない場合にも成功します。この問題は、2番目のファイルが追加されたときにTransitionStateManagerが正常にコンパイルされていてもゲーム内で発生します。

これはなぜ発生しているのですか？

編集：

あなたはGitHubのレポhereのコードのすべてを見ることができます。

私はgruntを実行し、ソースファイルをファイルに同梱されて出力される。しかし、ここでは便宜のために、私のGruntfile.js

module.exports = function (grunt) { 
    grunt.initConfig({ 
     pkg: grunt.file.readJSON('package.json'), 

     //allow import/export of JS classes 
     browserify: { 
     dist: { 
      options: { 
       transform: [ //transform ES6 code to ES5 code 
        ["babelify", { 
        loose: "all" 
        }] 
       ] 
      }, 
      files: { 
       "./dist/<%= pkg.name %>.js": ["./src/index.js"] 
      } 
     } 
     }, 

     //turn the output js file into a minified file (use less kB) 
     uglify: { 
      dist: { 
       files: { 
        "./dist/<%= pkg.name %>.min.js": ["./dist/<%= pkg.name %>.js"] 
       } 
      } 
     }, 

     //define the watch task: build when you save an edit 
     watch: { 
     scripts: { 
      files: ["./src/*.js"], 
      tasks: ["build"] 
     } 
     } 
    }); 

    grunt.loadNpmTasks("grunt-browserify"); 
    grunt.loadNpmTasks("grunt-contrib-watch"); 
    grunt.loadNpmTasks("grunt-contrib-uglify"); 

    grunt.registerTask("build", ["browserify","uglify"]);//define the modules that will run in the build task 
    grunt.registerTask("default", ["build","watch"]); //build and then start watching the files for changes 
}; 

編集です。私はそのファイルを取り出し、私のゲームプロジェクトのsrc/pluginsフォルダにコピーします。私のsrcフォルダには、ファイルPreload.jsがあり、それにはimport '../plugins/phaser-dynamic-state-transition';という行があります。この時点で、私には'./TransitionStateManager'と言っているGulpエラーがあります。

編集：

私は現在、NPMからこのtransition pluginを使用している、と私はそれが動作にもかかわらず...私はfrom the source直接それをダウンロードし、それを参照しようとした場合、私は同じエラーを持っていることを発見しましたNPMから罰金。

ワーキング：1. npm install phaser-state-transition --save 2.動作しないimport 'phaser-state-transition';

を通じて消費：1. Download the source 2. import '../plugins/phaser-state-transition';

編集を経て消費：私ならば、それは動作しますが、SO

GitHubリポジトリと私自身のリポジトリの両方で、縮小版（uglifyプラグインで構築）を使用してください。なぜこの作品が動作しているのか分かりません。

Answer 1

これは、以前のBrowserifyバンドル（プラグイン）が現在Browserified（あなたのゲーム）である依存関係グラフにあるときに発生します。要するに、Browserifyは以前のバンドルが自己完結型であることを認識せず、その中のrequire()コールを解決しようとします。私の詳細な説明はsubstack/node-browserify#1151です。

可能な解決策は以下のとおりです。以前のバンドル（プラグイン）derequire

• 。これは、プラグインを配布しようとしている場合にやりたいことです。

• あなたが発見したとおり、それを小さくします。

• 第2バンドル（ゲーム）を行うときにnoParseオプションを使用してください。

https://stackoverflow.com/a/28176927/1034448も参照してください。