Comments (5)
Looks like you haven't initizlized the library after importing it.
If you create a new file, let's say src/js/gallery.js
with this content
import lightGallery from 'lightgallery';
// Plugins
import lgThumbnail from 'lightgallery/plugins/thumbnail';
import lgZoom from 'lightgallery/plugins/zoom';
lightGallery(document.getElementById('lightgallery'), {
plugins: [lgZoom, lgThumbnail]
});
You should have a dist/js/gallery.min.js
correctly bundled.
Please note that this is not strictly related to Bricks or WordPress, more to the library itself, so if this doesn't work for you, I would advise you to read their documentation and refer to their developers.
from bricks.
Hi, first of all thank you for being interested in Bricks.
According to their documentation, after you have installed lightgallery either with npm install lightgallery
or yarn add lightgallery
, you can import the packages with
import lightGallery from 'lightgallery';
// Plugins
import lgThumbnail from 'lightgallery/plugins/thumbnail'
import lgZoom from 'lightgallery/plugins/zoom'
It works for me, it includes the library code inside the compiled bundle in /bricks/dist/js/scripts.min.js
I don't have a license so the gallery itself isn't really working on my test, but I'm not getting errors in the console, just a warning for the missing license.
Please let me know if this works for you as well.
from bricks.
Thanks for the quick reply! Bricks is very cool! 👍
Yes, i followed these import instructions earlier for compile separate file "lightgallery.min.js", because lightgallery need only for single posts/pages (CMS Wordpress). But got an message when gulp compile:
Generated an empty chunk: "lightgallery"
Code in compiled js-file lightgallery.min.js:
(function (factory) {
typeof define === 'function' && define.amd ? define(factory) :
factory();
})((function () { 'use strict';
}));
//# sourceMappingURL=lightgallery.min.js.map
What could be the problem?
from bricks.
It works! You are my savior! Thank you very much! 🤗
I'm not pro and started doing web development recently for a personal project. Therefore, many things are difficult... 🤕 And your bricks theme makes this process easier! 👍
What was my mistake - I initialized the library from another script, in which I write small pieces of custom code for the site. Because that's what it says in the documentation.
Your own custom scripts should be written in their own files, placed in sub-folders of src/js, that you must then individually include in scripts.js.
I created a script theme.js in src/js/components and import it to scripts.js
import './components/theme';
But with this library, this approach does not work.
You've helped me a lot. Thanks for the theme and support! 👍👍👍
from bricks.
This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.
from bricks.
Related Issues (20)
- Bootstrap 5 HOT 2
- AOS Example / Integration HOT 2
- Converting Gulpfile to ESM generates errors after updating gulp-imagemin HOT 5
- 🇩🇪 Add German translation HOT 4
- 🇫🇷 Add French translation HOT 15
- 🇪🇸 Add Spanish translation HOT 5
- Add Lithuanian translation HOT 3
- custom SVG sprite without font awesome HOT 5
- Font awesome not compile well. HOT 2
- Some Bootstrap classes not render well in npm run build HOT 2
- Sidebar for woocommerce HOT 3
- Dist folder missing HOT 2
- Font Awesome Issue after Yarn Build HOT 3
- Menu Drop down not working HOT 1
- Dropdown not working in Top Menu HOT 5
- Page Speed Insights HOT 2
- imagemin not working HOT 2
- Query on dropdown menu HOT 1
- Dropdown not working HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from bricks.