使用webpack动态加载PapaParse

时间:2015-02-17 12:23:07

标签: javascript webpack papaparse

我正在使用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库中this line的错误Uncaught ReferenceError: Papa is not defined

if (!config.chunkSize)
            config.chunkSize = Papa.LocalChunkSize;

有没有办法使这项工作?

[编辑]

我对requirejs / webpack来说是全新的,所以我不确定这是否是解决此问题的正确方法,但我设法让这个工作(不幸的是仍在污染窗口命名空间)使用以下shim configuration

require("imports?this=>window!exports?global.Papa!./papaparse.js").parse(event.target.files[0], {
  complete: function(results) {
  ...
  }
}

据我了解,第一个指令(imports?this=>window)使用导入加载器将global parameter设置为窗口对象(而不是空对象)。这使得PapaParse中的调用工作global.documentglobal.postMessage()工作(并且似乎也使得对Papa的无限制调用工作 - 即没有前缀为global.Papa的调用。第二个指令(exports?global.Papa)表示将Papa对象从require调用中导出为返回的对象。

如果有经验的webpack有人会建议这是否是正确的解决方法,我会感兴趣吗?

1 个答案:

答案 0 :(得分:2)

PapaParse现在应该在this commit之后使用webpack。另请参阅PR172