Webpack компилирует ES6 в модуль

Question

Я пытаюсь скомпилировать ES6 в файл с помощью Webpack и не могу понять, почему этот код не используется, как есть.

Side Примечание: Это должно быть плагин для VueJS

Я начинаю с простой файл, который экспортирует одну функцию, такую ​​как

exports.install =() => { 
    ... 
} 

Webpack использует babel-loader и babel-preset-es2015 к скомпилируйте его.

Вы можете найти конфигурацию, исходные и скомпилированные файлы webpack в this gist.

Моя проблема в том, что результат не является «требуемым» в моем приложении Vue ... У него есть какие-то странные вещи вокруг ядра, необходимые exports.install. Когда я удаляю все это и оставляю только exports.install = ..., все в порядке, иначе я просто ничего не получу.

Я использую его в другом приложении, построенном с помощью webpack, с помощью инструкции import.

Answer 1

Без output.libraryTarget опции WebPack будет генерировать пакет можно включить через <script> тег, но не import. Я думаю, это то, что вы видите.

Если вы хотите import (или require) в результате вашего WebPack сборки, вы должны установить libraryTarget в commonjs2

output: { 
    filename: 'index.js', 
    libraryTarget: "commonjs2" 
    }, 

С этой libraryTarget конфигурации, выход WebPack будет выглядеть module.exports = /* ... the "weird stuff" */, поэтому при импорте он, вы получите экспортированную функцию, которую вы ожидаете.

---

Если все, что вы делаете компиляции одного файла или набора файлов, которые будут импортированы в другой WebPack сборки, вы можете подумать, не используя WebPack на всех, и вместо того, чтобы с помощью Babel CLI непосредственно. В вашем Gist вы ничего не получаете от webpack, кроме упаковки вашего модуля в некоторый дополнительный код начальной загрузки webpack.