Review Dependencies (particularly autoprefixer)

[timbomckay]

I just started a new project trying to keep my dependencies low to reduce future vulnerabilities. I only have 5 packages but it installs 170 packages. I realize this is the world of micro-dependencies but it looks like 72 packages get installed just by adding tailwind.

"devDependencies": {
  "@fullhuman/postcss-purgecss": "^4.0.3",
  "postcss": "^8.3.8",
  "postcss-cli": "^9.0.1",
  "postcss-import": "^14.0.2",
  "tailwindcss": "^2.2.16"
}

I noticed autoprefixer was getting installed even though I wasn't requesting it. Then I noticed it was mentioned in Tailwind's peerDependencies. I didn't think peers were supposed to be automatically included but apparently it does as of npm v7, which I'm not sure what the difference is between dependencies and peers at this point but didn't look into it too much.

Could autoprefixer be unlisted and handled like cssnano here? I know this can be a tricky subject given the nature of CSS progression, but sometimes we may want to build with what's currently supported. It looks like there was a recent PR for autoprefixer, so perhaps this is already fresh in your mind. I'd be curious where you land on this either way.

I'm also a little curious if there are other dependencies that could be moved to devDependencies as there's a significant number there, but I obviously don't know the intricacies of tailwind.

[martinszeltins]

I don't think that autoprefixer is a hard dependency for tailwind. You can simply not install it and not add it to your postcss config if you don't want it. Correct me if I'm wrong.

[timbomckay]

As of npm 7 peerDependencies are automatically installed. More details found here.

Upon further review, it does look like they've added the peerDependenciesMeta field to prevent this autoinstall, allowing the dependency to be optional.

So perhaps Tailwind could add something like

{
  "peerDependencies": {
    "autoprefixer": "^10.0.2",
    "postcss": "^8.0.9"
  },
  "peerDependenciesMeta": {
    "postcss": {
      "autoinstall": true
    },
    "autoprefixer": {
      "autoinstall": false
    }
  }
}

[timbomckay]

There's also an optionalDependencies, if that helps.

[timbomckay]

I installed the listed dependencies to see how many packages were installed from each listing. These seem to shake out like so:

Package	Deps
autoprefixer	15
chokidar	15
cosmiconfig	24
fast-glob	18
tmp	13
postcss packages	17

It also looks like the number of packages just from installing tailwind is 140 when there are no previous packages installed that might be shared.

$ npm i tailwindcss
added 140 packages, and audited 141 packages in 7s

Not sure if this matters or perhaps just good to be aware of your footprint. One of those things that can be surprising when you install 1 package you've suddenly installed 140. I know that's the nature of micro-dependencies, but sometimes we get critical vulnerabilities of dependencies of dependencies of dependencies nested 5 or 6 deep and don't know who in that tree of dependencies should provide a solution.