Skip to content

Простая сборка webpack для демонстрации как именно собираются модули

License

Notifications You must be signed in to change notification settings

Hydrock/webpack-module-example

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

2 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

webpack-module-example

Простая сборка webpack для демонстрации как именно собираются модули

Что делаем?

  • Установи зависимости
  • Запусти сборку командой npm run build
  • Внимательно просмотри итоговый файл сборки bundle.js в папке dist

Ты увидишь несколько eval - это потому что webpack хранит весь твой код в виде строки (только в режиме разработки). Но если убрать все лишнее получится нечто вроде этого:

Условно, Webpack добавляет наш модуль в modules scope (не путать с областью видимости) в специальный массив __webpack_exports__

__webpack_require__.r(__webpack_exports__);
__webpack_require__.d(__webpack_exports__, { "default": () => (action) });

function action() {return 'value';};

А вот тут Webpack успешно достает наш модуль из modules scope и присваивает переменной _module__WEBPACK_IMPORTED_MODULE_0__ для дальнейшего использования.

__webpack_require__.r(__webpack_exports__);
__webpack_require__.d(__webpack_exports__, {
       "default": () => (__WEBPACK_DEFAULT_EXPORT__)
});

var _module__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("./src/module.js\");
         
const value = (0,_module__WEBPACK_IMPORTED_MODULE_0__["default"])();
         
const __WEBPACK_DEFAULT_EXPORT__ = (value);

About

Простая сборка webpack для демонстрации как именно собираются модули

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published