0

I'm struggling to get my head around how npm manages dependencies - in terms of how they are actually referenced in HTML.

Say I have a specific version of a plugin installed, which includes a version number in its path or file name - if npm is configured to update to a new minor release - the files referenced via script tags will no longer be present.

I've also read that exposing node_modules path is incorrect and should be avoided.

How then should these files be referenced so that they are loaded and so version updates do not break a site?

DJC
  • 1,175
  • 1
  • 15
  • 39

2 Answers2

1

The idea is that you use these modules in your code. Let's say you have a main.js file which has your application, then you import modules using import $ from 'jquery'; (this could depend on your configuration, you could also use 'require'). Then use a tool like browserify which is going resolve all your dependencies for you and package it into a nice file which can then be loaded into your browser.

This is only one setup out of many so this could vary, for example if you use webpack this will be different but the idea is the same, you import what you need into your main.js.

dandro
  • 79
  • 3
  • Ok so basically you don't reference node modules in script tags - you require them via a JS file. But out of the box - or without Browserify - npm is intended to be used with the require method? – DJC Feb 13 '17 at 23:43
  • Yes, think of it as now you have a bunch more classes/functions within reach and to access them you import/require them in your application/business logic files. – dandro Feb 14 '17 at 01:41
  • Thanks for this. So what's the difference between normal npm usage with require, and Browserify? – DJC Feb 14 '17 at 09:38
  • Well because normal npm is for Node there are modules that would use Node's core library functionality like fs (for file system), this will not work in the browser, in fact the require function will not work in the browser, so browserify will go through this modules and to some extent make it work in the browser. There are some modules that will just not work though. – dandro Feb 14 '17 at 23:03
-1

npm uses package.json file as reference to build dependency map. And installs all dependencies in node_modules folder. When you publish an update to your module, you also publish a new version of package.json file which will include modifications to dependencies.

So short answer is - package.json file... I hope you can figure things out from this.

spooky
  • 1,620
  • 1
  • 13
  • 15