Pattern Lab with second package.json

Question

I have a Pattern Lab edition-node-gulp set up and would like to use NPM to manage UI dependencies, like jQuery, D3 and others. Pattern Lab is set up so that development happens in a 'Source' folder, which is complied and moved to a 'Public' folder. The root of the Public folder becomes the root of the application when served.

Currently, I include assets like jQuery and others manually. I think it would be great to manage dependencies like jQuery right in the package.json file used to run all of Pattern Lab Node, but the node_modules folder exists outside of Public, so I can not reference it in the live application.

So far, it seems that I have two options:

1. Continue as is, and forget package management for these assets.
2. Create a second package.json inside Public with jQuery and others, which seems sloppy.

Is creating a second package.json so bad? Am I failing to consider some other option?

Answer 1

Creating a second package.json is not that bad (when you know what and how you are doing of course). However in your particular case it is not the best scenario because there are way better options.

What is the problem? Adding the assets to the build output. So, what you can do:

1. install the assets via npm install and save them in the original package.json
2. adapt gulpfile.js to copy the files in the output directory.

If the second step step is too hacky / problematic it could be also replaced with simple package.json scripts change (add build script):

"scripts": {
  "gulp": "gulp -- ",
  "build": "npm run gulp && cp -R node_modules/jquery/dist/blablabla.js mypublicdir/blablabla.js"
},

and then run it as npm run build. If you need to support Windows you can use https://www.npmjs.com/package/cp-cli instead of cp.