# HookWebpackError: \_\_webpack\_modules\_\_ is not defined

**URL:** https://discourse.aurelia.io/t/hookwebpackerror-webpack-modules-is-not-defined/4463
**Category:** Help Requests
**Created:** [November 2, 2021, 4:50pm UTC](https://discourse.aurelia.io/t/hookwebpackerror-webpack-modules-is-not-defined/4463 "2021-11-02T16:50:19Z")
**Posts on this page:** 4
**Page:** 1

<div class="post-metadata">

### Author: ![vidriduch](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/vidriduch/32/675_2.png) [@vidriduch](https://discourse.aurelia.io/u/vidriduch)
#### Post date: [November 2, 2021, 4:50pm UTC](https://discourse.aurelia.io/t/hookwebpackerror-webpack-modules-is-not-defined/4463/1 "2021-11-02T16:50:19Z")

</div>

to reproduce:

1. New Aurelia V1 project via `au new appName` → options typescript,htmlmin,sass,vscode`

2. Add bootstrap and bootswatch via yarn install.

3. New file called zimports.ts in src root with contents  
`import "bootswatch/dist/yeti/bootstrap.min.css";`

4. Then import this file in main.ts  
`import './zimport';`

5. `au run --watch`

6. it builds but got an error:

Any ideas why is this happening? I used to be able to do this with no problems… Thank you!

```auto
javascript modules 636 bytes
  ./src/main.ts 547 bytes [built] [code generated]
  ./src/zimport.ts 50 bytes [built] [code generated]
  ./node_modules/bootswatch/dist/yeti/bootstrap.min.css 39 bytes [built] [code generated] [1 error]

ERROR in ./node_modules/bootswatch/dist/yeti/bootstrap.min.css
Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
HookWebpackError: __webpack_modules__ is not defined
    at tryRunOrWebpackError (D:\Temp\e3web\node_modules\webpack\lib\HookWebpackError.js:88:9)
    at __webpack_require_module__ (D:\Temp\e3web\node_modules\webpack\lib\Compilation.js:4963:12)
    at D:\Temp\e3web\node_modules\webpack\lib\Compilation.js:4987:11
    at symbolIterator (D:\Temp\e3web\node_modules\neo-async\async.js:3485:9)
    at timesSync (D:\Temp\e3web\node_modules\neo-async\async.js:2297:7)
    at Object.eachLimit (D:\Temp\e3web\node_modules\neo-async\async.js:3463:5)
    at D:\Temp\e3web\node_modules\webpack\lib\Compilation.js:4863:16
    at symbolIterator (D:\Temp\e3web\node_modules\neo-async\async.js:3485:9)
    at done (D:\Temp\e3web\node_modules\neo-async\async.js:3527:9)
    at D:\Temp\e3web\node_modules\webpack\lib\Compilation.js:4778:8
-- inner error --
ReferenceError: __webpack_modules__ is not defined
    at webpack/runtime/Aurelia expose webpack internal:1:50
    at D:\Temp\e3web\node_modules\webpack\lib\javascript\JavascriptModulesPlugin.js:460:11
    at Hook.eval [as call] (eval at create (D:\Temp\e3web\node_modules\tapable\lib\HookCodeFactory.js:19:10), <anonymous>:9:1)
    at Hook.CALL_DELEGATE [as _call] (D:\Temp\e3web\node_modules\tapable\lib\Hook.js:14:14)
    at D:\Temp\e3web\node_modules\webpack\lib\Compilation.js:4965:39
    at tryRunOrWebpackError (D:\Temp\e3web\node_modules\webpack\lib\HookWebpackError.js:83:7)
    at __webpack_require_module__ (D:\Temp\e3web\node_modules\webpack\lib\Compilation.js:4963:12)
    at D:\Temp\e3web\node_modules\webpack\lib\Compilation.js:4987:11
    at symbolIterator (D:\Temp\e3web\node_modules\neo-async\async.js:3485:9)
    at timesSync (D:\Temp\e3web\node_modules\neo-async\async.js:2297:7)

Generated code for webpack/runtime/Aurelia expose webpack internal
1 | __webpack_require__.m = __webpack_require__.m || __webpack_modules__ ;
2 | __webpack_require__.c = __webpack_require__.c || __webpack_module_cache__ ;
 @ ./src/zimport.ts 1:0-48
 @ ./src/main.ts 3:0-19
 @ ./node_modules/aurelia-webpack-plugin/runtime/empty-entry.js

webpack 5.61.0 compiled with 1 error in 944 ms

```

---

<div class="post-metadata">

### Author: ![MaximBalaganskiy](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/maximbalaganskiy/32/831_2.png) [@MaximBalaganskiy](https://discourse.aurelia.io/u/MaximBalaganskiy)
#### Post date: [November 3, 2021, 6:19am UTC](https://discourse.aurelia.io/t/hookwebpackerror-webpack-modules-is-not-defined/4463/2 "2021-11-03T06:19:19Z")

</div>

try

```auto
      new MiniCssExtractPlugin({
        experimentalUseImportModule: false
      }),

```

---

<div class="post-metadata">

### Author: ![vidriduch](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/vidriduch/32/675_2.png) [@vidriduch](https://discourse.aurelia.io/u/vidriduch)
#### Post date: [November 3, 2021, 9:19am UTC](https://discourse.aurelia.io/t/hookwebpackerror-webpack-modules-is-not-defined/4463/3 "2021-11-03T09:19:27Z")

</div>

Thank you. It worked with css, but importing scss still showing some errors. I have created a new issue for this here [HookWebpackError: \_\_webpack\_modules\_\_ is not defined when importing css/scss in typescript file · Issue #197 · aurelia/webpack-plugin · GitHub](https://github.com/aurelia/webpack-plugin/issues/197)

---

<div class="post-metadata">

### Author: ![ghiscoding](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/ghiscoding/32/1199_2.png) [@ghiscoding](https://discourse.aurelia.io/u/ghiscoding)
#### Post date: [November 5, 2021, 3:05pm UTC](https://discourse.aurelia.io/t/hookwebpackerror-webpack-modules-is-not-defined/4463/4 "2021-11-05T15:05:03Z")

</div>

That got fixed by @bigopon with an update on `aurelia-webpack-plugin` to `5.0.3`, check the new [release](https://github.com/aurelia/webpack-plugin/releases/tag/v5.0.3) for it.
