# Include directories from node\_modules

**URL:** <https://talk.jekyllrb.com/t/include-directories-from-node-modules/6255>\
**Category:** Help\
**Created:** [July 19, 2021, 4:10pm UTC](https://talk.jekyllrb.com/t/include-directories-from-node-modules/6255 "2021-07-19T16:10:07Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![COV-GIS](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.jekyllrb.com/cov-gis/32/3744_2.png) [@COV-GIS](https://talk.jekyllrb.com/u/COV-GIS)\
**Post date:** [July 19, 2021, 4:10pm UTC](https://talk.jekyllrb.com/t/include-directories-from-node-modules/6255/1 "2021-07-19T16:10:07Z")

</div>

Base on this PR [https://github.com/jekyll/jekyll/pull/7188](https://github.com/jekyll/jekyll/pull/7188) specific directories can be included. But it’s not working.

```auto
include:
  - node_modules/some-package/dist

```

The only way I found that works is to include `node_modules` and exclude all non-required packages and specific directories in required packages. Which isn’t practical.

Any insight on this or am I reading the above thread wrong about including specific directories in `node_modules`?

Thanks.

---

<div class="post-metadata">

**Author:** ![chuckhoupt](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.jekyllrb.com/chuckhoupt/32/523_2.png) [@chuckhoupt](https://talk.jekyllrb.com/u/chuckhoupt)\
**Post date:** [July 21, 2021, 12:56pm UTC](https://talk.jekyllrb.com/t/include-directories-from-node-modules/6255/2 "2021-07-21T12:56:16Z")

</div>

One work-around is to use a symbolic link to the `dist` folder. For example:

```auto
ln -s node_modules/some-package/dist mydist

```

Now, when you build the site, the contents of `some-package/dist` will be copied to `_site/mydist/`.

---

<div class="post-metadata">

**Author:** ![MichaelCurrin](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.jekyllrb.com/michaelcurrin/32/2340_2.png) [@MichaelCurrin](https://talk.jekyllrb.com/u/MichaelCurrin)\
**Post date:** [July 22, 2021, 11:55am UTC](https://talk.jekyllrb.com/t/include-directories-from-node-modules/6255/3 "2021-07-22T11:55:54Z")

</div>

I don’t think symbolic link will work.

When Jekyll builds it will copy the symlink and not the contents of the directory.

Also in `_site` you will have a reference to `./node_modules/...` which is invalid.

So you can make it absolute but then it won’t work on another machine.

The way I solve this is a command at build time locally or CI.

```auto
cp node_modules/foo/dist/bar.js assets/js

# multiple at once
cp node_modules/foo/dist/bar.js \
  node_modules/fizz/buzz.js \
  assets/js

jekyll build

```

And then make sure those are in .gitignore file.

When Jekyll runs it will copy assets/js to `_site/assets/js`.

That can be done inside Makefile or package.json script commands.

No need to mess with include field or symlinks.

* * *

Or for a simple project, drop use of node\_modules altogether and just reference JS files in HTML by CDN URL.

---

<div class="post-metadata">

**Author:** ![TerminalAddict](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.jekyllrb.com/terminaladdict/32/1300_2.png) [@TerminalAddict](https://talk.jekyllrb.com/u/TerminalAddict)\
**Post date:** [July 27, 2021, 11:59am UTC](https://talk.jekyllrb.com/t/include-directories-from-node-modules/6255/4 "2021-07-27T11:59:32Z")

</div>

If you’re talking sass, then in your config you can:

```auto
sass:
    load_paths:
        - _sass
        - node_modules
        - assets/css
        - assets/vendor

```

if you’re talking about js, then move things around during your build process.

Here’s a portion of my Makefile:

```auto
include-npm-deps:
        @if [! -d "$(VENDOR_DIR)"]; then mkdir -p $(VENDOR_DIR); fi
        @if [! -d "$(JSBUNDLE_DIR)"]; then mkdir -p $(JSBUNDLE_DIR); fi
        @cp node_modules/jquery/dist/jquery.min.js $(VENDOR_DIR)
        @cp node_modules/popper.js/dist/umd/popper.min.js $(VENDOR_DIR)
        @cp node_modules/bootstrap/dist/js/bootstrap.min.js $(VENDOR_DIR)
        @cp node_modules/datatables.net/js/jquery.dataTables.min.js $(VENDOR_DIR)
        @cp node_modules/jquery/dist/jquery.min.map $(JSBUNDLE_DIR)
        @cp node_modules/popper.js/dist/umd/popper.min.js.map $(JSBUNDLE_DIR)
        @cp node_modules/bootstrap/dist/js/bootstrap.min.js.map $(JSBUNDLE_DIR)

build: include-npm-deps
        @export JEKYLL_ENV=production
        @echo "Building Production _site"
        @$(BUNDLE) exec $(JEKYLL) build

```

---

<div class="post-metadata">

**Author:** ![jackyjoy123](https://avatars.discourse-cdn.com/v4/letter/j/d6d6ee/32.png) [@jackyjoy123](https://talk.jekyllrb.com/u/jackyjoy123)\
**Post date:** [August 4, 2021, 12:57pm UTC](https://talk.jekyllrb.com/t/include-directories-from-node-modules/6255/5 "2021-08-04T12:57:50Z")

</div>

thanks for the awesome information.

---

<div class="post-metadata">

**Author:** ![jackyjoy123](https://avatars.discourse-cdn.com/v4/letter/j/d6d6ee/32.png) [@jackyjoy123](https://talk.jekyllrb.com/u/jackyjoy123)\
**Post date:** [January 3, 2022, 8:33am UTC](https://talk.jekyllrb.com/t/include-directories-from-node-modules/6255/6 "2022-01-03T08:33:47Z")

</div>

> [@TerminalAddict](#):
>
> if you’re talking about js, then move things around during your build process.
> 
> Here’s a portion of my Makefile:
> 
> ```auto
> include-npm-deps:
> @if [! -d "$(VENDOR_DIR)"]; then mkdir -p $(VENDOR_DIR); fi
> @if [! -d "$(JSBUNDLE_DIR)"]; then mkdir -p $(JSBUNDLE_DIR); fi
> @cp node_modules/jquery/dist/jquery.min.js $(VENDOR_DIR)
> @cp node_modules/popper.js/dist/umd/popper.min.js $(VENDOR_DIR)
> @cp node_modules/bootstrap/dist/js/bootstrap.min.js $(VENDOR_DIR)
> @cp node_modules/datatables.net/js/jquery.dataTables.min.js $(VENDOR_DIR)
> @cp node_modules/jquery/dist/jquery.min.map $(JSBUNDLE_DIR)
> @cp node_modules/popper.js/dist/umd/popper.min.js.map $(JSBUNDLE_DIR)
> @cp node_modules/bootstrap/dist/js/bootstrap.min.js.map $(JSBUNDLE_DIR)
> 
> build: include-npm-deps
> @export JEKYLL_ENV=production
> @echo "Building Production _site"
> @$(BUNDLE) exec $(JEKYLL) build
> 
> ```
> 
> [https://talktosonic.onl](https://talktosonic.onl) [https://talktowendys.vip](https://talktowendys.vip)

thanks my issue has been fixed.
