2015-02-17 4 views
4

Я использую PapaParse для загрузки csv-файла из ввода файла.Загрузка PapaParse динамически с помощью webpack

В настоящее время у меня есть рабочая версия, где я загрузить 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) { 
    ... 
    } 
} 

К сожалению, это дает мне ошибку Uncaught ReferenceError: Papa is not defined из this line в библиотеке PapaParse:

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.document и global.postMessage() работы (а также, как представляется, делают неквалифицированные звонки на Papa, то есть те, которые не префиксны как global.Papa). Вторая директива (exports?global.Papa) означает, что объект Papa экспортируется как возвращаемый объект из требуемого вызова.

Мне было бы интересно, если бы кто-то, у кого был опыт работы с webpack, мог бы посоветовать, является ли это правильным способом справиться с этим?

+0

Внутри Papa Parse переменная 'Papa' создается в глобальном контексте. Я не знаком с webpack или RequireJS или что-то в этом роде, но я предполагаю, что webpack возится с глобальным пространством имен ...? – Matt

+0

@Matt Я сделал несколько экспериментов и обновил вопрос своими выводами. Я не уверен, что лучший способ для библиотеки поддерживать прямое включение в веб-страницу с помощью тега

Смежные вопросы