Как экспортировать анонимную самовызывающуюся функцию js в es6 формате?

Question

[Александра]

В общем у меня есть это в одном файле

(function() {
shop.addEventListener('click', function() {
     // какое то действие
    });
}());

В другом принимаю импорт так с пустыми скобками и это работает!
import {} from '../loc/store';

Можно ли так делать?

Comments

[Сергей delphinpro]

Да вы можете и скобки убрать
import from './file';

Так же и стили импортируются в бандл

import from './file.css';
import from './file.sass';

[Александра]

Сергей delphinpro, да, я просто хотела понять как правильнее подключать файлы к точке входа, значит достаточно просто подключить файл, а не делать экспорт функции, сделала еще короче без from
import '../loc/store';

[Сергей delphinpro]

Александра, Верно. Но как уже сказали, это просто объединение нескольких файлов. Есть определенные нюансы. Если вы все же желаете использовать функцию из модуля, ее лучше явным образом экспортировать/импортировать.

[Сергей delphinpro]

Если взять ваш пример, то как-то так

export default addGoods() {
  //...
}

Потом

import addGoods from './shop/addGoods';

shop.addEventListener('click', e=>{
  addGoods();
})

[Александра]

Сергей delphinpro, спасибо, я поняла, к точке входа я просто подключаю файлы, а внутри этих файлов уже работаю с модулями, вот так, импортирую в виде объекта

Answer 1

[profesor08]

Импортируя код в файле выполняется, создаются ссылки, функции, и выполняются самовызывающиеся конструкции вроде твоей. Собственно это там и происходит.

Если ты хочешь по настоящем пользоваться импортом и экспортом, то надо делать иначе:

// shop.js
export function createShop(selector) {
  document.querySelector(".createShop").addEventListener("click", e => {
    // ...
  });
}

// index.js
import { createShop } from "./shop.js";

createShop(".shop");

Answer 2

[Владимир]

У вас работает со сборщиком или нейтивныйе модули?

Вообще написанно странно, если это независимая самовызывающаяся функция, то зачем ее импортировать, просто подключите в файл, если она зависит от окружения или окружение зависит от нее, то не делайте ее самовызывающейся, сделайте метод и вызывайте в том месте, где импортируете.
А пока это выглядит как случайно работающий костыль.

Comments

[Александра]

у меня вебпак, спасибо, все верно, сделала просто подключение к точке входа
import '../loc/store';

Answer 3

[Stalker_RED]

Экспорт по сути не происходит, просто вызывается функция.

Comments

[Александра]

import {} from '../loc/store';
но если это закоментировать то не работает

[Ярослав Иванов]

AlexaShemetova, ну так вам же и ответили что происходит.

[Александра]

Ярослав Иванов, уже да)