Как подключить fancybox к webpack
Вопрос
Я занимаюсь web разработкой и мне нужно подключить к webpack fancybox. Подскажите как мне это сделать? Я использую npm. Все модули подключаю в файле app.js. Не могу понять что нужно прописать в файле webpack.config.js и app.js.
Ответ
Если установлен Fancybox 2 нужно удалить и устанвить Fancybox 3
<![CDATA[npm uninstall fancybox --save-dev]]>
<![CDATA[npm install @fancyapps/fancybox --save-dev]]>
Затем в app.js нужно прописать
<![CDATA[
const jquery = require("jquery");
const $ = require("jquery");
const jQuery = require("jquery");
window.jQuery = $;
const fancybox = require("@fancyapps/fancybox");
]]>
В файле webpack.config.js нужно прописать
<![CDATA[
plugins: [
$: 'jquery',
jQuery: 'jquery',
'window.jQuery': 'jquery'
})
]
]]>
<![CDATA[
rules: [
{
test: /fancybox[\/\\]dist[\/\\]js[\/\\]jquery.fancybox.cjs.js/,
use: "imports-loader?jQuery=jquery,$=jquery,this=>window"
}
]
]]>
И возможно нужно будет устновиь imports-loader
<![CDATA[npm i imports-loader]]>
Комментарии к статье