2

I know node/express. I know the difference between dependencies and devDependencies.

I'm learning angular. I've been through the official tutorial.

I thought an angular app is compiled - at development time - into a set of static files. Those files are uploaded to some server. Once they are downloaded by a client, all the action takes place in the client, except when it reaches out to my node/express server for data.

So I don't understand why a scaffolded angular project has a package.json with both dependencies and devDependencies. I assumed everything would be in devDependencies, because there is no package.json at runtime, only the bootstrapping html file and then all the compiled javascripts.

I'm obviously misunderstanding the deployment stage. Please correct me where I'm wrong.

lonix
  • 14,255
  • 23
  • 85
  • 176

2 Answers2

5

I think found the answer.

Both deps and devdeps are only used during development-time, rather than at run-time (because there's no manifest at runtime, only html and compiled scripts). That was the source of my confusion.

However the compilation stage only compiles and bundles references found in the deps.

Add to that 1) tree shaking, and 2) you may inadvertantly eliminate downstream modules (if referenced as devdeps rather than deps), means that they must be in the deps section.

So this is a semantic clue for the compiler to know what to bundle - it's not an issue of devtime vs runtime. So it was confusing because that's a subtle difference to how this works on the server side.

lonix
  • 14,255
  • 23
  • 85
  • 176
0

Dev dependencies are only to make your life easier for faster development / troubleshooting / testing. they are marked like this so they wouldn't bulk up your final build. also, in this way, you also have a global flag. this is used e.g for tools/cli's you use across projects. nodemon is an example... etc

marc_s
  • 732,580
  • 175
  • 1,330
  • 1,459
jcuypers
  • 1,774
  • 2
  • 14
  • 23
  • Thanks, but like I said, I understand the difference between dependencies and devDependencies. I'm using node already. What I don't understand is why angular has dependencies. If it is delivered as a "binary" (so to speak) shouldn't everything be a devdependency? There is no package manifest at runtime (or am I wrong about that). It's just a bootstrapper and some javascripts – lonix Feb 21 '19 at 07:34
  • from what i understand there's the use of webpack. which bundles up everything for distribution. this is why you have all these main.js / vendor.js / ... (this should be the output of a prod build). I dont think there would be a package.json there. when you talk about scaffolding a project. its still the base stage before that. it has a package.json for dependency check. lets say you send me your project and i want to get started on it, i just do npm install and it will install all the necessary requirements based on the package.json file. – jcuypers Feb 21 '19 at 07:41
  • Exactly. So those are development-time requirements, not run-time requirements. So why not label them all as devdeps? Is there a semantic reason for that, or a practical one? – lonix Feb 21 '19 at 07:44
  • 1
    The reason is that the webpack will only include the dependencies in the final bundle output, not the dev-dependencies. some libraries are needed in the final output. so i guess there's the distinction. I dont think there's more to it :) – jcuypers Feb 21 '19 at 07:47