Erro "Uncaught TypeError: Cannot read property 'addEventListener' of null" em card.js

Pessoal,

Executei todos os passos e verifiquei mais de uma vez meu código, inclusive com os arquivos do projeto. Estão todos iguais.

Porém, ao tentar rodar para inserir um novo card, o console de cara apresenta o seguinte erro:

Uncaught TypeError: Cannot read property 'addEventListener' of null

Este erro ocorre na linha 3 do arquivo card.js (após a modificação da parte 5.8 do curso). Seguem os arquivos card.js e newCard.js:

card.js

var $wrapCard = document.querySelector('.wrap-card');
var $cardOptions = document.querySelectorAll('.card-options');
//a linha abaixo apresenta o erro
$wrapCard.addEventListener('click', function (e) { 
  var $this = e.target;
  var $card = $this.parentNode.parentNode.parentNode;
  var $cardContent = $card.querySelector('.card-content');

  if ($this.dataset.color) {
    $card.dataset.color = $this.dataset.color;

    for (var p = 0; p < $cardOptions.length; p++) {
      $cardOptions[p].classList.remove('isActive');
    };

    $this.classList.add('isActive');
  };

  if ($this.classList.contains('card_delete')){
    $card.remove();
  }
  if ($this.classList.contains('card_edit')){
    if($cardContent.getAttribute('contenteditable') == 'false'){
      $cardContent.setAttribute('contenteditable', 'true');
      $cardContent.focus();
      $this.classList.add('isActive');
    }else{
      $cardContent.setAttribute('contenteditable', 'false');
      $cardContent.blur();
      $this.classList.remove('isActive');
    }
  }
});

newCard.js

var $newCard = document.querySelector('.newCard');
var $newCardContent = document.querySelector('.newCard-content');
var $newCardAction = document.querySelector('.newCard-action');

$newCardContent.addEventListener('input', function(){
  var $error = document.querySelector('.error');

  if($error != null){
    $error.remove();
  };
});

$newCard.addEventListener('submit', function(e){
  e.preventDefault();
  if($newCardContent.value == ''){
    if(document.querySelector('.error') == null){
      var $error = document.createElement('span');
      $error.classList.add('error');
      $error.textContent = 'Por favor, preencha o campo acima.';
      $newCard.insertBefore($error, $newCardAction);
    };
  }else{
    var $wrapCard = document.querySelector('.wrap-card');
    var $card = document.querySelector('.card');
    var $copyCard = $card.cloneNode(true);
    $copyCard.querySelector('.card-content').textContent = $newCardContent.value;
    $wrapCard.insertBefore($copyCard, $card);
  };
});

O que pode estar ocorrendo?