javascript - son - Exportación con nombre frente a la exportación de un objeto

prompt javascript ejemplo

Question

Por qué funciona esto:

const str = ''stuff'';
export {
  str
};

Pero no esto:

export default {
  str: ''stuff''
};

Me gustaría importarlo de la siguiente manera:

import { str } from ''myLib'';

Me gustaría asignar el valor directamente en la exportación y no requerir tener que crear una variable de antemano.

También cuando intento:

export {
  str: ''stuff''
};

Me sale el error:

SyntaxError: /home/karlm/dev/project/ex.js: Unexpected token, expected , (41:5)
  39 | 
  40 | export {
> 41 |   str: ''stuff''
     |      ^
  42 | };
  43 | 

Answer 1

Hay dos estilos de exportación en ES6: exportaciones "normales" y exportación predeterminada. Las exportaciones normales se exportan con una sintaxis como esta:

export const str = ''stuff'';
// or
const str = ''stuff'';
export {str};

Las exportaciones predeterminadas son las siguientes:

export default const str = ''stuff'';
// or 
export default {
  str: ''stuff''
};

La diferencia aparece cuando importas. Con el primero, debe incluir llaves:

import {str} from ''myModule''; // ''stuff'', from the first example

Sin llaves, importa la exportación predeterminada:

import myModule from ''myModule''; //  {str: ''stuff''}, from the second example

Answer 2

La razón principal de la declaración de exportación es para exportar funciones, objetos o primitivas de un archivo (o módulo) dado.

Pero necesita un identificador para poder exportarlo (para que pueda importarse a través de la import en otro script).

Simplemente puede hacer:

export const obj = {
  str: ''stuff''
};

Durante la importación , podrá usar el mismo nombre obj para referirse al valor correspondiente.

E importarlo como:

import { obj } from ''myLib'';