Laravel Mix，安装PhotoSwipe库的正确方法

Question

我尝试将PhotoSwipe包含到我的项目中。以及如何正确地包含所有lib文件、JS、CSS和图像的问题。

我做了这样的事情-

yarn add photoswipe

而不是我添加的esources/assets/js/bootstrap.js的底部

window.PhotoSwipe = require('photoswipe');

但我还需要包含package.json中没有描述的额外JS (photoswipe ui-default.js)，不确定这是正确的方式吗？

mix.copy('node_modules/photoswipe/dist/photoswipe-ui-default.js', 'public/js');

<script src="{{ asset('js/photoswipe-ui-default.js') }}" defer></script>

还有如何包含皮肤文件的问题？

Answer 1

我从来不喜欢使用mix.copy脚本或css，所以我做的是

在bootstrap.js中

window.PhotoSwipe = require('photoswipe');
window.PhotoSwipeUI_Default = require('./../../node_modules/photoswipe/src/js/ui/photoswipe-ui-default.js');

在app.scss中

@import "~photoswipe/src/css/main";
@import "~photoswipe/src/css/default-skin/default-skin";

当使用它时

new window.PhotoSwipe( pswpElement, window.PhotoSwipeUI_Default, items, options);

希望它的帮助=D