PapaParse を使用して、ファイル入力から csv ファイルをロードしています。
現在、スクリプトタグを使用して PapaParse をロードする作業バージョンがあります。
<script type="text/javascript" src="papaparse.js" ></script>
そして、変更イベントを処理します:
Papa.parse(event.target.files[0], {
complete: function(results) {
...
}
}
私は今、webpack を使用して js をバンドルしたいと考えており、グローバル名前空間に毎回ではなく、必要なときに動的に PapaParse をロードしたいと考えています。このようなもの:
require("./papaparse.js").Papa.parse(event.target.files[0], {
complete: function(results) {
...
}
}
残念ながら、これによりPapaParse ライブラリの次の行Uncaught ReferenceError: Papa is not defined
からエラーが発生します。
if (!config.chunkSize)
config.chunkSize = Papa.LocalChunkSize;
これを機能させる方法はありますか?
[編集]
私はrequirejs / webpackにまったく慣れていないので、これがこれを修正する正しい方法であるかどうかはわかりませんが、次のシム構成を使用して、これを機能させることができました(残念ながら、ウィンドウの名前空間をまだ汚染しています) :
require("imports?this=>window!exports?global.Papa!./papaparse.js").parse(event.target.files[0], {
complete: function(results) {
...
}
}
私が理解しているように、最初のディレクティブ ( imports?this=>window
) は imports loader を使用して、global
パラメーターを (空のオブジェクトではなく) ウィンドウ オブジェクトに設定します。これにより、PapaParse の呼び出しが機能しますglobal.document
(global.postMessage()
また、修飾されていない呼び出しもPapa
機能するようです。つまり、接頭辞が付いていないものglobal.Papa
)。2 番目のディレクティブ ( exports?global.Papa
) は、require 呼び出しから返されたオブジェクトとして Papa オブジェクトがエクスポートされることを意味します。
これがこれに対処する正しい方法であるかどうか、webpackの経験がある人がアドバイスできるかどうか興味がありますか?