Reference js file outside assets directory


#1

How do I reference a js file outside my assets directory?

This is my project structure

node_modules

themes

  • mytheme
    – assets
    — js
    — css
{{ $mainjs := resources.Get "js/main.js" }}
{{ $lityjs := resources.Get "node_modules/lity/dist/lity.js" }}

Reference to main.js is working. But I have no idea how to get lity.js from the node_modules. Tried many things like

{{ $lityjs := resources.Get "node_modules/lity/dist/lity.js" }}
{{ $lityjs := resources.Get "./node_modules/lity/dist/lity.js" }}
{{ $lityjs := resources.Get "../../../node_modules/lity/dist/lity.js" }}

Best way to include JavaScript libraries in Hugo sites
#2

A symbolic link would be your only option.


#3

Hi Bep. Thanks! Do you have any hugo related info for using symbolic links?

Are there any plans to create a pipe that transforms require statements in JavaScript? So I can simple write require("lity"); in my main.js file?


#4

I’m trying to get a library installed via NPM:
{{ $jquery := resources.Get "node_modules/jquery/dist/jquery.js" }}

Then I create in myproject/⁨themes⁩/mytheme/⁨assets folder a symbolic link to myproject/⁨node_modules but it doesn’t work. It says:

Symbolic links for directories not supported, skipping " ... assets/node_modules"

Any helps?