How To Use Packery with Ember

I just started ember and want to use packery as layouting library. The ember app has been created via ember new wep-app. Packery has been installed via npm install packery. According to ember dependency management, I can load Packery via app.import('node_modules/packery/js/packery.js')

How do I use packery now? The application.hbs looks like this

<div class="grid">
   <div class="grid-item">cdsc</div>
   <div class="grid-item grid-item--width2">...</div>
   <div class="grid-item">...</div>
</div>

But it seems not to work. In a similar question, someone mentions the creation of a component ember g component packery-grid, which should be filled accordingly

import Component from '@ember/component';

export default Component.extend({
   classNames: ['grid'], 
   didInsertElement() {
   this.$('.grid').packery({
       // options
       itemSelector: '.grid-item'
       });
   }
 }); 

Using a component, the application.hbs template should look like this:

<div class="grid-item">cdsc</div>
<div class="grid-item grid-item--width2">...</div>
<div class="grid-item">...</div>

However, this does not work either. What shall I do to have packery integrated into ember? I use ember 3.5.1.

EDIT: There is an ember component for packery as well, which does not work as well.