Magento 2: get masonry working / source file path

Question

• Magento2 is installed via composer
• I've written a custom theme, based on luma
• masonry is installed via bower - the bower_components folder is placed in: app/design/frontend/VENDOR/MY_THEME/web

I've defined a new requireJS module for masonry in a requirejs-config.js

Question 1: Where should that file be? In .../MY_THEME/Magento_Theme or directly in my theme? Question 2: What is the correct path to the masonry source file in the bower_components? Because all my custom js-files end up somewhere below pub/static/frontend...

var config = {
 paths:{
 // creates a module named 'masonry'
 // points to the masonry source file
 "masonry":"???/web/bower_components/masonry/masonry"
 },
 shim:{
 // make sure that jquery is completely loaded when masonry starts loading
 'masonry':{
 'deps':['jquery']
 }
 }
};

I've read the answers of this question - but can't get it work without the correct source path.

Answer 1

Question1

Directly in your theme. Your requirejs-config.js will be:

var config = {
 map:{
 "masonry":"bower_components/masonry/masonry"
 },
 shim:{
 'masonry':{
 'deps':['jquery']
 }
 }
};

Question2

The correct path could be app/design/frontend/VENDOR/THEME/web/js/bower_components if you use your dependency directly. During the static asset deployment Magento will put you resources in pub/static/frontend/VENDOR/THEME/LOCALE/js/bower_components.

• Steffi: Thank you, I already found that out :-) It works for me with this path in map: "web/bower_components/masonry/masonry"