Webpack + Symfony再次加入 - 如何添加库

Question

我是使用webback和encore的新手，所以我不知道究竟是哪种方法来处理它。

我有一个带有几个js文件的网站，它使用jQuery和Bootstrap。 我想使用webpack创建一个独特的缩小的js文件。

我已经能够按照Symfony网站上的示例成功地做到这一点，所以我能够只包含一个app.js和encore正确构建依赖项。

我的app.js中没有使用一些javascript库，但会在网站内嵌的一些javascript代码中使用，例如PhotoSwipe。

目前，我需要在main.js文件中使用PhotoSwipe库，尽管此文件不使用此库。

// Resources/public/js/main.js
import PhotoSwipe from 'photoswipe';
import PhotoSwipeUI_Default from 'photoswipe/dist/photoswipe-ui-default';

那么，我如何告诉安可将这个库添加到构建的app.js中而不必将其添加到我的main.js中？

我已将其添加到webpack.config.json中

.addEntry('app', [
    './src/AppBundle/Resources/public/js/main.js',
    'photoswipe',
    'photoswipe/dist/photoswipe-ui-default'
])

如果我检查生成的app.js，我可以看到代码已添加到app.js，但是当我尝试使用我的html代码调用Photoswipe时，我得到错误Uncaught ReferenceError: PhotoSwipe is not defined

我猜这是因为库被限制在js文件中，我应该添加某种导出才能访问，我不知道，正如我所说的，我是非常新的;）

Answer 1

这就是我管理我的库的方式：

// Resources/public/js/myCustomScript.js
const PhotoSwipe = require('photoswipe.js)';
const PhotoSwipeUI_Default = require ('photoswipe/dist/photoswipe-ui-default');
[...] // do PhotoSwipe stuff

仅在您的webpack.config.json ：

.addEntry('myCustomScript', './src/AppBundle/Resources/public/js/myCustomScript.js')

然后在需要此脚本的模板中：

<script type="text/javascript" src="{{ asset('build/myCustomScript.js') }}"></script>