É importante dizer que em JavaScript, cada arquivo é considerado como um módulo e todas as variáveis e funções que ele possui só são acessíveis dentro dele, a menos que você explicitamente as exporte. O import e export são bem flexíveis

O caso mais comum: export default

Sempre que criarmos um arquivo (módulo), e quisermos exportar algum dado dele para acessar em outro, vamos fazer um código bem similar:

// ## ex01/moduloA.js

const variavel = 'Valor';
const variavel2 = 'Outro Valor';

export default variavel;

// ## ex01/moduloB.js

import Modulo;

console.log(Modulo); // => 'Valor'

A variavel2 não está disponível como um valor acessível no moduloB.

Não precisamos passar o nome variavel, o nome é um apelido e você pode escolher o que fizer mais sentido dentro do contexto da importação, lembrando que, é uma boa prática fazer o import com o nome do arquivo na maioria das vezes, ficando algo como moduloA.

// ## ex01/moduloB.js

import ModuloA;

console.log(ModuloA); // => 'Valor'

Como exportar multiplos valores de um arquivo?

É exportar um objeto com os dados que queremos acessar em outro arquivo.

// ## ex01/moduloA.js

const variavel = 'Valor';
const variavel2 = 'Outro Valor';

export default {
   variavel: variavel,
   variavel2: variavel2,
};

// ## ex01/moduloB.js

import Modulo;

console.log(Modulo); 
// { variavel: 'Valor', variavel2: 'Outro Valor' }

Outra maneira é fazer na hora que declaramos uma variável ou função, colocar um export atrás:

// ## ex01/moduloA.js

export const variavel = 'Valor';
export const variavel2 = 'Outro Valor';

// ## ex01/moduloB.js

import { variavel, variavel2 };

console.log(variavel, ' e ' ,variavel2); 
// 'Valor e Outro Valor'

Estamos fazendo um object destructuring, e acessando cada valor individualmente, poderiamos também fazer o import como import * as Modulo, assim cada valor que exportamos seria agrupado dentro de um módulo.

Da pra misturar tudo? Sim!

// ## ex01/moduloA.js

export const variavel = 'Valor';
export const variavel2 = 'Outro Valor';

export default 'Valor default do módulo';

// ## ex01/moduloB.js

import ValorDoModulo, { variavel, variavel2 };

console.log(variavel, ' e ' ,variavel2); 
// 'Valor e Outro Valor'

console.log(ValorDoModulo);
// Valor default do módulo'