o console mostra esse erro
listaDeTarefas.js:12 Uncaught TypeError: Cannot set property 'innerHTML' of null at HTMLButtonElement.criarTarefa (listaDeTarefas.js:12)
o meu código está assim
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=BioRhyme&family=Space+Mono&display=swap">
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<title>Ceep</title>
</head>
<body>
<div class="app">
<div class="todo-list">
<h1 class="title">
Ceep
</h1>
<form class="form" action="">
<input class="form-input" type="text" data-form-input>
<button class="form-button" data-form-button> Novo Item
</button>
</form>
<ul class="list">
<li class = "task" data-task->
<p class = "content">
comprar um abacate
</p>
</li>
</ul>
</div>
<script src = "listaDeTarefas.js"></script>
</body>
</html>listaDeTarefas.js
const criarTarefa = (evento) => {
evento.preventDefault()
const input = document.querySelector('[data-form-input]')
const valor = input.value
const tarefa = document.querySelector('[data-task]')
const conteudo = `<p class ="content">${valor}</p>`
tarefa.innerHTML = conteudo
input.value = " "
}
const novaTarefa = document.querySelector('[data-form-button]')
novaTarefa.addEventListener('click', criarTarefa)
