# Importing from node\_modules with js.Build uses "require" / CommonJS

**URL:** <https://discourse.gohugo.io/t/importing-from-node-modules-with-js-build-uses-require-commonjs/33254>\
**Category:** support\
**Tags:** pipes\
**Created:** [June 6, 2021, 11:42am UTC](https://discourse.gohugo.io/t/importing-from-node-modules-with-js-build-uses-require-commonjs/33254 "2021-06-06T11:42:36Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![dermellor](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/dermellor/32/14544_2.png) [@dermellor](https://discourse.gohugo.io/u/dermellor)\
**Post date:** [June 6, 2021, 11:42am UTC](https://discourse.gohugo.io/t/importing-from-node-modules-with-js-build-uses-require-commonjs/33254/1 "2021-06-06T11:42:37Z")

</div>

I’m trying to include node\_modules with [Hugo Pipes](https://gohugo.io/hugo-pipes/js/), in exactly the way which was described [here](https://discourse.gohugo.io/t/importing-from-node-modules-with-js-build/27249). But the output is something like that:

`var import_underscore = __toModule(require("underscore"));`

… which, of course, does not work in the browser. Am I supposed to enable “require” with Browserify etc.?

Thanks a lot!

---

<div class="post-metadata">

**Author:** ![davidsneighbour](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/davidsneighbour/32/24507_2.png) [@davidsneighbour](https://discourse.gohugo.io/u/davidsneighbour)\
**Post date:** [June 6, 2021, 12:33pm UTC](https://discourse.gohugo.io/t/importing-from-node-modules-with-js-build-uses-require-commonjs/33254/2 "2021-06-06T12:33:14Z")

</div>

You seem to mix two things together. To use javascript modules, you need to use JSBuild which compiles the “required” modules into one single JS file. I am not sure, but “CommonJS” sounds like a very old concept to me (RequireJS?).

Did you read through the JSBuild docs on [hugo.io](http://hugo.io)?

> **[JavaScript Building](https://gohugo.io/hugo-pipes/js/#include-dependencies-in-packagejson--node_modules)**
>
> Hugo Pipes can process JavaScript files with \[ESBuild\](https://github.com/evanw/esbuild).

It’s probably best if you post some samples of how your JS is compiled (in a layout) and the JS itself to point you to issues.

---

<div class="post-metadata">

**Author:** ![bep](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/bep/32/3332_2.png) [@bep](https://discourse.gohugo.io/u/bep)\
**Post date:** [June 6, 2021, 2:07pm UTC](https://discourse.gohugo.io/t/importing-from-node-modules-with-js-build-uses-require-commonjs/33254/3 "2021-06-06T14:07:57Z")

</div>

> [@dermellor](#):
>
> var import\_underscore = \_\_toModule(require(“underscore”));

The above suggests to me that you use the `Externals` option to “load” underscore (this doesn’t work, and that option isn’t relevant in the browser).

You may get some input here:

> **[GitHub - gohugoio/hugoTestProjectJSModImports: Test project used for...](https://github.com/gohugoio/hugoTestProjectJSModImports)**
>
> Test project used for integration testing. Contribute to gohugoio/hugoTestProjectJSModImports development by creating an account on GitHub.

---

<div class="post-metadata">

**Author:** ![dermellor](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/dermellor/32/14544_2.png) [@dermellor](https://discourse.gohugo.io/u/dermellor)\
**Post date:** [June 7, 2021, 6:36am UTC](https://discourse.gohugo.io/t/importing-from-node-modules-with-js-build-uses-require-commonjs/33254/4 "2021-06-07T06:36:43Z")

</div>

Okay, I found my mistake. I’ve tried to address node modules _within my theme folder_ (my JS file is also in themes/theme-name/assets/js/). This does not work. As soon as I put my package.json in the root folder and install the node modules, it works just fine! (And yes, also with \_underscore.js). Don’t know what’s the best way to include node dependencies in a theme, but probably that’s another topic. Thanks!