Using modular javascript with DocPad

Question

I am just getting started learning DocPad and hope to use it on a few sites that will serve some fairly javascript heavy pages. I am also hoping to be able to keep the javascript as modular as possible using nodes export and require conventions because much of the code I want to use has already been written that way.

I’ve install the babel and browserifydocs plugins, but I am getting errors every time I try use import or require. If I follow the directions on the babel plugin site and add

---
 browserify: true
---

to the js.babel files, I get an Invalid left-hand side expression in prefix operation error.

Is it possible to use javascript I have or do I need to add all of the javascript files in the @getBlock(“scripts”) line of the layout file.

Answer 1

Can you upload the full docpad log file somewhere, generated via running docpad with the -d flag.

Looking at this, it seems the issue may be the space before browserify: true

Perhaps cc the babel plugin author in on this.

Answer 2

If you want to do a proper modular js do it with webpack (https://blog.madewithlove.be/post/webpack-your-bags/) that is specially designed for it. Then just combine it with DocPad in the way that at the end of the generation you trigger a webpack compilation. DocPad sends proper events where you can hook in.

Also there is a plugin for that but I never used it and I'm not sure how good it is https://github.com/RobLoach/docpad-plugin-webpack