JavaScript files not loading

Question

The JavaScript files for my theme aren't loading. What am I missing?

My theme.info.yml:

name: theme
type: theme
description: Custom theme.
core: 8.x
base theme: classy
version: 8.x-1.0
libraries:
  - theme/global-styling
#stylesheets-remove:
#  - '@classy/css/components/tabs.css'
#  - core/assets/vendor/normalize-css/normalize.css
regions:
  logo: 'Logo'
  navigation: 'Navigation'
  slider: 'Slider'
  content: Content  # the content region is required
  contact: 'Contact (Content Top)'
  testimonials: 'Testimonials'
  call-to-action: 'Call To Action'
  footer_logo: 'Footer logo'
  footer_first: 'Footer first'
  footer_second: 'Footer second'
  footer_third: 'Footer third'
  footer_copyright: 'Footer Copyright'
regions_hidden:
  - sidebar_first

My theme.libraries.yml:

global-styling:
  version: 1.x
  css:
    theme:
      css/animate.css: {}
      css/bootstrap.css: {}
      css/et-line-icons.css: {}
      css/font-awesome.min.css: {}
      css/extralayers.css: {}
      css/settings.css: {}
      css/magnific-popup.css: {}
      css/owl.carousel.css: {}
      css/owl.transitions.css: {}
      css/full-slider.css: {}
      css/text-effect.css: {}
      css/menu-hamburger.css: {}
      css/style.css: {}
      css/responsive.css: {}
      css/custom.css: {}
      //vjs.zencdn.net/5.8.8/video-js.css: { type: external }
  js:
    //vjs.zencdn.net/ie8/1.1.2/videojs-ie8.min.js: { type: external, minified: true }
    js/modernizr.js: {}
    js/bootstrap.js: {}
    js/bootstrap-hover-dropdown.js: {}
    js/jquery.easing.1.3.js: {}
    js/skrollr.min.js: {}
    js/smooth-scroll.js: {}
    js/jquery.appear.js: {}
    js/wow.min.js: {}
    js/page-scroll.js: {}
    js/jquery.easypiechart.js: {}
    js/jquery.parallax-1.1.3.js: {}
    js/jquery.isotope.min.js: {}
    js/owl.carousel.min.js: {}
    js/jquery.magnific-popup.min.js: {}
    js/popup-gallery.js: {}
    js/text-effect.js: {}
    js/jquery.tools.min.js: {}
    js/jquery.revolution.js: {}
    js/counter.js: {}
    js/jquery.countTo.js: {}
    js/jquery.fitvids.js: {}
    js/imagesloaded.pkgd.min.js: {}
    js/classie.js: {}
    js/hamburger-menu.js: {}
    js/main.js: {}
  dependencies:
    - core/jquery
    - core/drupal
    - core/drupalSettings

Answer 1

Try this : Add this code in .info.yml

libraries:
        - 'theme/global-styling'
        - 'theme/global-scripting'

And include the CSS and JS the libraries.yml file like below.Include styles and scripts seprately.

 global-styling:
    css:
      theme:
       css/style.css: {}

 global-scripting:
    css:
      theme:
         js/script.js: {}