emberjs add bootstrap template javascript

I have a bootstrap template with custom css and js that I want to use with ember.js. I am stuck with integrating the js. I have to say that I usually don't work on the frontend side, so if this is an obvious mistake I made, excuse me. I want to stick with the js I have from the template and don't want to include ember-bootstrap for example.

node version: v14.15.5, ember-cli: 3.25.0

npm packages to include: bootstrap@5.0.0-beta2, flickity, flickity-imagesloaded, flickity-as-nav-for, flickity-fade, jarallax

I have identified two tasks here. First, I need to integrate the existing npm packages. Then I need to add the custom scripts.

Current status

1. Packages

I added the npm packages to ember-cli-build.js over app.import()

// ember-cli-build.js file
const EmberApp = require('ember-cli/lib/broccoli/ember-app');

module.exports = function (defaults) {
  let app = new EmberApp(defaults, {});
  
  app.import("node_modules/bootstrap/dist/js/bootstrap.min.js");
  app.import("node_modules/jarallax/dist/jarallax.min.js", {
    using: [{ transformation: 'cjs', as: 'jarallax' }]
  });
  app.import("node_modules/flickity/dist/flickity.pkgd.min.js");
  app.import("node_modules/flickity-as-nav-for/as-nav-for.js");
  app.import("node_modules/flickity-fade/flickity-fade.js");
  app.import("node_modules/flickity-imagesloaded/flickity-imagesloaded.js");

  return app.toTree();
};

When I go to the debug tab in my browser I see the packages are getting loaded under assets/node_modules/.. but js does not have any effect.

I tried to load the package in index.html over a script tag:

<script type="text/javascript" src="assets/node_modules/flickity/dist/flickity.pkgd.min.js"></script>

I get the error in the browser console window:

Refused to execute http://localhost:4200/assets/node_modules/flickity/dist/flickity.pkgd.min.js as script because "X-Content-Type-Options: nosniff" was given and its Content-Type is not a script MIME type.

2. Custom js scripts

The custom scripts have a moin theme.js script that imports everything else.

// js/theme.js
// Theme
import './aos';
import './bigpicture';
// ...

The imported Javascript scripts from theme.js also have imports like

// js/aos.js (imported from theme.js)
import AOS from 'aos';

const options = {
  duration: 700,
  easing: 'ease-out-quad',
  once: true,
  startEvent: 'load'
};

AOS.init(options);

The original theme.js also had import for Bootstrap and the other libraries.

// js/theme.js
// Vendor
import 'bootstrap';
import 'flickity';
// ...
import 'jarallax';

// Theme
import './aos';
import './bigpicture';
// ...

I had the js directory under vendor, public and app the import via the script tag did not work either. Importing from app.js has no effect.