Как передать переменную и вернуть данные другому javascript

Question

Я пытаюсь разделить мою функцию main() на 3 разных js файла. Вот файл, который я хочу создать:

query.js, который содержит переменную, функцию запроса и извлечения
viewdata.js содержит компонент DOM, который создан с использованием данных из выборки
main.js, которые содержат функцию для вызова fetch и DOM Element

также здесь мой грубо работающий main () в main. js

function main(keyword) {

let season = keyword;
let date = new Date();
let localyear = date.getFullYear();
var query;

let query = `
query ($page: Int, $perPage: Int, $seasonYear: Int, $search: String) {
  ...
}
`;

if(season == "Spring"){
  ... //pick static query that match keyword
}

let variables = {
  ... //variable to assign to query
};


let url = 'myurl',
    options = { ...
    };

fetch(url, options).then(handleResponse)
                   .then(handleData)
                   .catch(handleError);
}
//end of query.js that i want

//start of viewdata.js that i want
function handleResponse(response) {
    return response.json();
}

function handleData(data) {
    const listDataElement = document.querySelector("data-list");


    data.data.Page.media.forEach(media => {
            ... //this DOM Element created from data.data.Page.media array
        });

}

function handleError(error) {
    alert('Error, check console');
    console.error(error);
}

export default main;

main() функция вызывается с использованием main(keyword), где keyword Раньше я выбирал stati c запрос, который я создал.

Я пытался использовать функцию return results раньше, но это не сработало, как я хочу (результат данных не отправляется на main. js from fetch .then в запросе. js), кто-нибудь может мне помочь с такими вещами? заранее спасибо!