# Webpack / canjs 3 : can-util module loaded many time

**URL:** <https://forums.bitovi.com/t/webpack-canjs-3-can-util-module-loaded-many-time/520>\
**Category:** CanJS\
**Created:** [December 23, 2016, 9:14pm UTC](https://forums.bitovi.com/t/webpack-canjs-3-can-util-module-loaded-many-time/520 "2016-12-23T21:14:18Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![jcarbou](https://avatars.discourse-cdn.com/v4/letter/j/49beb7/32.png) [@jcarbou](https://forums.bitovi.com/u/jcarbou)\
**Post date:** [December 23, 2016, 9:14pm UTC](https://forums.bitovi.com/t/webpack-canjs-3-can-util-module-loaded-many-time/520/1 "2016-12-23T21:14:18Z")

</div>

Hi All,

I’m upgarding my project from canjs 2 (and require 😖) to canjs 3 (and webpack 1). I identify that the can-util/xxx modules are loaded by many can-xxx modules. Example for “can-util/dom/events/attributes/attributes” with webpack log :

…  
./~/can-stache-bindings/~/can-util/dom/events/attributes/attributes.js 2.29 kB {0} [built]  
…  
/~/can-stache/~/can-util/dom/events/attributes/attributes.js 2.29 kB {0} [built]  
…  
./~/can-view-live/~/can-util/dom/events/attributes/attributes.js 2.29 kB {0} [built]  
…

That generate bugs.

Examples :

- the “inserted” event is never throw for my components (I think make-mutation-event loaded many time).
- canViewModel(element) always return undefined .  
…

I try different webpack configuration (DedupePlugin,…). Finally I fix this behaviour using alias in webpack :

alias: {  
“can-util”: \_\_dirname + ‘/node\_modules/can-util’  
…  
}

There is another better solution ?

I can’t generate this problem with jsbin. Sorry

---

<div class="post-metadata">

**Author:** ![chasen](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.bitovi.com/chasen/32/402_2.png) [@chasen](https://forums.bitovi.com/u/chasen)\
**Post date:** [December 24, 2016, 1:12am UTC](https://forums.bitovi.com/t/webpack-canjs-3-can-util-module-loaded-many-time/520/2 "2016-12-24T01:12:19Z")

</div>

Hey @jcarbou, I haven’t been able to reproduce these issues.

I made a branch with an example webpack setup: [https://github.com/chasenlehara/canjs-webpack-example/tree/forum-post-520](https://github.com/chasenlehara/canjs-webpack-example/tree/forum-post-520)

It has a component that depends on `can-view-model` and the `inserted` event: [https://github.com/chasenlehara/canjs-webpack-example/blob/forum-post-520/src/component.js#L16-L19](https://github.com/chasenlehara/canjs-webpack-example/blob/forum-post-520/src/component.js#L16-L19)

If you follow the readme to install the dependencies and build the bundle, you should be able to load `index.html` and see “Inserted was called” on the page.

It’d be great if you could fork that branch and come up with a minimal case where it fails, or if you could share a minimal example from the code you’re working with, that would work too.

[Also, since you’re making the switch, have you considered [StealJS](http://stealjs.com/) for your module loading/bundling needs? If you have but decided against it, I’d love to understand why it wasn’t a good fit for you!]

---

<div class="post-metadata">

**Author:** ![jcarbou](https://avatars.discourse-cdn.com/v4/letter/j/49beb7/32.png) [@jcarbou](https://forums.bitovi.com/u/jcarbou)\
**Post date:** [January 3, 2017, 9:31pm UTC](https://forums.bitovi.com/t/webpack-canjs-3-can-util-module-loaded-many-time/520/3 "2017-01-03T21:31:01Z")

</div>

Hi Chasen,

First, thank you for the very prompt response (and the wonderful canjs project !). With your fork everthing work well ! I tried to reproduce these issues with my package.json, webpack config… no effect, everthing work well… 😠

Finally I delete my “node-modules” directory and then re-run an npm install for my project =\> No more issues 🙂

Next time, I will try that if a stange behaviour appears…

For the choice “steal vs webpack” is not my main priority because I migrate my code from requirejs/canjs 2 using strict ES6 syntax without extra webpack loader prefix :  
import "myFile.css"  
no  
import “css!./stylesheet.css”.

So I think I will switch to steal.js without code migration. I’ like webpack loaders for js / css / sass / stache / svg (svg to font). I lose stache compilation on build (can-complile)…

Next step : mocha integration for test (webpack + babel + canjs + mocha…)

I will try steal.js after for the same project to compare these 2 solutions and validate a final choice.

---

<div class="post-metadata">

**Author:** ![chasen](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.bitovi.com/chasen/32/402_2.png) [@chasen](https://forums.bitovi.com/u/chasen)\
**Post date:** [January 5, 2017, 12:49am UTC](https://forums.bitovi.com/t/webpack-canjs-3-can-util-module-loaded-many-time/520/4 "2017-01-05T00:49:07Z")

</div>

`node_modules` issues are a pain. I’m glad it’s working now!

When you decide to check out StealJS, be sure to check out the website to find plugins for [mocha](https://www.npmjs.com/package/steal-mocha), [sass](https://www.npmjs.com/package/steal-sass), [stache](https://www.npmjs.com/package/steal-stache), [svg](https://www.npmjs.com/package/steal-svg), etc. Always feel free to post here if you have any questions. 😊
